hi I am a newbie and although I designed and built a little bit of my website myself, a friend programmed most of it. I am very happy with it but the loading of the thumbs when you goto another gallery page is all over the place, they are not aligned initially and then snap into place! the speed is not really an issue I am happy with the loading time, but the little dance the thumbs do when loading is annoying! here is my site (An Illustration portfolio) so you can see what I mean, click on one of the gallery links like "web and storyboards"
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Planet Elan.com</title>
<script src="js/elan.js" type="text/javascript"></script>
<STYLE TYPE="text/css">
#image {
visibility:hidden;
position:absolute;
top:213px;
}
#image2 {
visibility:hidden;
position:absolute;
top:212px;
}
#image3 {
top:212px;
visibility:hidden;
position:absolute;
}
#image4 {
top:233px;
visibility:hidden;
position:absolute;
}
#image5 {
top:213px;
visibility:hidden;
position:absolute;
}
#image6 {
top:212px;
visibility:hidden;
position:absolute;
}
#image7 {
top:212px;
visibility:hidden;
position:absolute;
}
#image8 {
top:212px;
visibility:hidden;
position:absolute;
}
#image9 {
top:213px;
visibility:hidden;
position:absolute;
}
#image10 {
top:212px;
visibility:hidden;
position:absolute;
}
#image11 {
top:213px;
visibility:hidden;
position:absolute;
}
#image12 {
top:211px;
visibility:hidden;
position:absolute;
}
#image13 {
top:212px;
visibility:hidden;
position:absolute;
}
#image14 {
top:213px;
visibility:hidden;
position:absolute;
}
#image15 {
top:212px;
visibility:hidden;
position:absolute;
}
#image16 {
top:213px;
visibility:hidden;
position:absolute;
}
.style2 {
font-size: 8px;
font-family: Arial, Helvetica, sans-serif;
color: #98A1B0;
}
</style>
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>
<body style="background:#000000;padding:0px;margin:0px;" onload="swapLayers('image5'); return false;">
<table width="100%" cellpadding="0" cellspacing="0">
<tr align="left"><td height="200px">
<table width="1022" cellpadding="0" cellspacing="0">
<tr><td width="30"></td>
<td width="50"> </td>
<td width="249">
<table cellpadding="0" cellspacing="0" width="750">
<tr>
<tr valign="left">
<td width="605"><img src="images/spacer-elan_black.gif" width="139" height="5" /></td>
<td height="50px"><img src="images/Elan-Harris.gif" width="204" height="51" /></td>
<td width="135" align="right"><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image49','','images/homepage_black_roll.gif',1)"><img src="images/homepage_black.gif" name="Image49" width="135" height="51" border="0" id="Image49" /></a></td>
<td width="135" align="right"><a href="http://www.designbyhumans.com/shop/detail/3040" target="_blank" onmouseover="MM_swapImage('Image43','','images/t-shirts_black_roll.gif',1)" onmouseout="MM_swapImgRestore()"><img src="images/t-shirts_black.gif" name="Image43" width="135" height="51" border="0" id="Image43" /></a></td>
<td width="135" align="right"><a href="about elan.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image46','','images/about-elan_black_roll.gif',1)"><img src="images/about-elan_black.gif" name="Image46" width="135" height="51" border="0" id="Image46" /></a></td>
<td width="108" align="right">
<span style="color:#FFFFFF">
<h1><a href="contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image45','','images/contact_black_roll.gif',1)"><img src="images/contact_black.gif" name="Image45" width="135" height="51" border="0" id="Image45" /></a></h1>
</span> </td>
</tr></table>
</td>
</tr>
</table>
</td></tr>
<tr valign="center"><td bgcolor="#FFFFFF" >
<table cellpadding="0" cellspacing="0">
<tr><td width="30px"></td><td width="590px" height="395px">
<div align="center" id="image">
<img src="images/united_healthcare.jpg" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image2">
<img src="images/celeb_1.gif" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image3">
<img src="images/alberto_kids.jpg" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image4">
<img src="images/target.jpg" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image5">
<img src="images/alberto_3.jpg" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image6">
<img src="images/celeb_2_2.gif" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image7">
<img src="images/Virgin_staff.jpg" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image8">
<img src="images/dracula.gif" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image9">
<img src="images/shopperholic.jpg" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image10">
<img src="images/celeb_3.gif" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image11">
<img src="images/nathans.jpg" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image12">
<img src="images/thumb_spacer.gif" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image13">
<img src="images/cityslicker.jpg" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image14">
<img src="images/caspian.gif" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image15">
<img src="images/Report-on-UFO.gif" alt="Elan Harris" align="absmiddle"/>
</div>
<div align="center" id="image16">
<img src="images/thumb_spacer.gif" alt="Elan Harris" align="absmiddle"/>
</div>
</td>
<td width="30px"></td>
<td>
<table cellspacing="0" height="50px">
<tr>
<td>
<div align="center"><a href="event.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image42','','images/event-2.gif',1)"><img src="images/event_concepts_rollover.gif" name="Image42" width="89" height="32" border="0" id="Image42" /></a></div>
<table cellpadding="4" cellspacing="0">
<tr><td ><a href= "java script://" onmouseover="swapLayers('image'); return false"><img src="images/united_healthcare_tb.jpg" border=0 alt="Elan Harris" /></a></td>
</tr>
<tr><td ><a href= "java script://" onmouseover="swapLayers('image2'); return false"><img src="images/celeb_1_tb.gif" border=0 alt="Elan Harris" ></a></td>
</tr>
<tr><td ><a href= "java script://" onmouseover="swapLayers('image3'); return false"><img src="images/alberto_kids_tb.gif" border=0 alt="Elan Harris" ></a></td>
</tr>
<tr><td ><a href= "java script://" onmouseover="swapLayers('image4'); return false"><img src="images/Target_tb.gif" border=0 alt="Elan Harris"/></a></td>
</tr>
</table>
</td>
<td><div align="center"><img src="images/people-concepts.gif" width="89" height="32" /></div>
<table cellpadding="4" cellspacing="0">
<tr><td ><a href= "java script://" onmouseover="swapLayers('image5'); return false"><img src="images/alberto_2_tb.jpg" border="0" alt="Elan Harris"/></a></td>
</tr>
<tr><td ><a href= "java script://" onmouseover="swapLayers('image6'); return false"><img src="images/celeb_2_2_tb.gif" border="0" alt="Elan Harris"/></a></td>
</tr>
<tr><td ><a href= "java script://" onmouseover="swapLayers('image7'); return false"><img src="images/Virgin_staff_tb.jpg" border="0" alt="Elan Harris"/></a></td>
</tr>
<tr><td ><a href= "java script://" onmouseover="swapLayers('image8'); return false"><img src="images/dracula_tb.gif" border="0" alt="Elan Harris"/></a></td>
</tr>
</table>
</td>
<td><div align="center"><a href="web.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image47','','images/web-&-storyboards.gif',1)"><img src="images/web-&-storyboards-rollover.gif" name="Image47" width="89" height="32" border="0" id="Image47" /></a></div>
<table cellpadding="4" cellspacing="0">
<tr><td ><a href= "java script://" onmouseover="swapLayers('image9'); return false"><img src="images/shopperholic_tb.jpg" border="0" alt="Elan Harris"/></a></td>
</tr>
<tr><td ><a href= "java script://" onmouseover="swapLayers('image10'); return false"><img src="images/celeb_3_tb.gif" border="0" alt="Elan Harris"/></a></td>
</tr>
<tr><td ><a href= "java script://" onmouseover="swapLayers('image11'); return false"><img src="images/nathans_tb.gif" border="0" alt="Elan Harris"/></a></td>
</tr>
<tr><td ><a href= "java script://" onmouseover="swapLayers('image12'); return false"><img src="images/thumb_spacer.gif" border="0" alt="Elan Harris"/></a></td>
</tr>
</table>
</td>
<td>
<div align="center"><a href="icons.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image48','','images/icons_technical.gif',1)"><img src="images/icons_tech_rollover.gif" name="Image48" width="89" height="32" border="0" id="Image48" /></a></div>
<table cellpadding="4" cellspacing="0">
<tr><td ><a href= "java script://" onmouseover="swapLayers('image13'); return false"><img src="images/cityslicker_tb.jpg" border="0" alt="Elan Harris"/></a></td>
</tr>
<tr><td ><a href= "java script://" onmouseover="swapLayers('image14'); return false"><img src="images/caspian_tb.gif" border="0" alt="Elan Harris"/></a></td>
</tr>
<tr><td ><a href= "java script://" onmouseover="swapLayers('image15'); return false"><img src="images/UFO_tb.gif" border="0" alt="Elan Harris"/></a></td>
</tr>
<tr><td ><a href= "java script://" onmouseover="swapLayers('image16'); return false"><img src="images/thumb_spacer.gif" border="0" alt="Elan Harris"/></a></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td></tr>
</table>
<table width="900" align="left" cellpadding="3" cellspacing="0">
<tr>
<td> <div align="right"><span class="style2">© All materials copyrighted. No portion of this website may be reproduced in any form without prior written consent of the copyright holder.</span></div></td>
</tr></table>
</body>
</html>
Forum Index:
Programming Help |
C and C++ |
VB6 |
Java |
VB.NET |
C# |
ASP.NET |
PHP |
ColdFusion |
Perl and Python |
Ruby |
Databases |
Other Languages |
Game Programming |
Mobile Development |
Software Development |
Computer Science |
Industry News |
Programming Tutorials |
C++ Tutorials |
Visual Basic Tutorials |
Java Tutorials |
VB.NET Tutorials |
C# Tutorials |
Linux Tutorials |
PHP Tutorials |
ColdFusion Tutorials |
Windows Tutorials |
HTML/JavaScript Tutorials |
CSS Tutorials |
Flash Tutorials |
Web Promotion Tutorials |
Graphic Design & Photoshop Tutorials |
Software Development Tutorials |
Database Tutorials |
Other Language Tutorials |
ASP.NET Tutorials |
Game Programming Tutorials |
WPF & Silverlight Tutorials |
17 Jun, 2009 - 08:45 AM
| 
