- Impact
- 19
Hi again. I'm making a photography site, which has some alblums in it from adobe imageready. Here it is:
http://ephi.blansh.com/21stCenturyPictures/
I'm really sorry about the large image sizes, this will be fixed soon. I know it takes a long time to load. When on the main page, click on the side where it says Art Reproduction (as this page loads the fastest). The black album part is from imageready. I just took the code and placed it in frontpage.
I want to know how to do something: You realize that when you rollover an image, a larger version appears right next the the thumbnails. But, when you take your mouse off of the thumbnail, the large image switches back to the original image! How do I make it so that when the mouse is taken off the image, the large image remains the same until rolled over another thumbnail? It keeps switching, and that is very annoying. Once again, sorry about long loading.
If you want the code to that rollover "album," here it is (has some html):
Code:
Thanks
http://ephi.blansh.com/21stCenturyPictures/
I'm really sorry about the large image sizes, this will be fixed soon. I know it takes a long time to load. When on the main page, click on the side where it says Art Reproduction (as this page loads the fastest). The black album part is from imageready. I just took the code and placed it in frontpage.
I want to know how to do something: You realize that when you rollover an image, a larger version appears right next the the thumbnails. But, when you take your mouse off of the thumbnail, the large image switches back to the original image! How do I make it so that when the mouse is taken off the image, the large image remains the same until rolled over another thumbnail? It keeps switching, and that is very annoying. Once again, sorry about long loading.
If you want the code to that rollover "album," here it is (has some html):
Code:
Code:
<html>
<head>
<title>Art Rollovers</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- ImageReady Preload Script (Art Rollovers.psd) -->
<script type="text/javascript">
<!--
function newImage(arg) {
if (document.images) {
rslt = new Image();
rslt.src = arg;
return rslt;
}
}
function changeImages() {
if (document.images && (preloadFlag == true)) {
for (var i=0; i<changeImages.arguments.length; i+=2) {
document[changeImages.arguments[i]].src = changeImages.arguments[i+1];
}
}
}
var preloadFlag = false;
function preloadImages() {
if (document.images) {
Art_Rollovers_Layer_1_over = newImage("images/Art-Rollovers_Layer-1-over.gif");
Art_Rollovers_Layer_1_over010 = newImage("images/Art-Rollovers_Layer-1-ov-10.gif");
preloadFlag = true;
}
}
// -->
</script>
<!-- End Preload Script -->
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onload="preloadImages();">
<!-- ImageReady Slices (Art Rollovers.psd) -->
<table id="Table_01" width="751" height="384" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="8">
<img src="images/Art-Rollovers_01.gif" width="750" height="8" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="8" alt=""></td>
</tr>
<tr>
<td rowspan="6">
<img src="images/Art-Rollovers_02.gif" width="8" height="376" alt=""></td>
<td colspan="2">
<img src="images/Art-Rollovers_Layer-1.gif" width="122" height="89" alt=""></td>
<td rowspan="6">
<img src="images/Art-Rollovers_04.gif" width="25" height="376" alt=""></td>
<td rowspan="3">
<a href="#"
onmouseover="changeImages('Art_Rollovers_Layer_1008', 'images/Art-Rollovers_Layer-1-over.gif'); return true;"
onmouseout="changeImages('Art_Rollovers_Layer_1008', 'images/Art-Rollovers_Layer-1-08.gif'); return true;"
onmousedown="changeImages('Art_Rollovers_Layer_1008', 'images/Art-Rollovers_Layer-1-over.gif'); return true;"
onmouseup="changeImages('Art_Rollovers_Layer_1008', 'images/Art-Rollovers_Layer-1-over.gif'); return true;">
<img src="images/Art-Rollovers_Layer-1-06.gif" width="80" height="113" border="0" alt=""></a></td>
<td rowspan="6">
<img src="images/Art-Rollovers_06.gif" width="26" height="376" alt=""></td>
<td rowspan="5">
<img name="Art_Rollovers_Layer_1008" src="images/Art-Rollovers_Layer-1-08.gif" width="478" height="347" alt=""></td>
<td rowspan="6">
<img src="images/Art-Rollovers_08.gif" width="11" height="376" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="89" alt=""></td>
</tr>
<tr>
<td colspan="2">
<img src="images/Art-Rollovers_09.gif" width="122" height="14" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="14" alt=""></td>
</tr>
<tr>
<td rowspan="4">
<img src="images/Art-Rollovers_10.gif" width="1" height="273" alt=""></td>
<td rowspan="2">
<a href="#"
onmouseover="changeImages('Art_Rollovers_Layer_1008', 'images/Art-Rollovers_Layer-1-ov-10.gif'); return true;"
onmouseout="changeImages('Art_Rollovers_Layer_1008', 'images/Art-Rollovers_Layer-1-08.gif'); return true;"
onmousedown="changeImages('Art_Rollovers_Layer_1008', 'images/Art-Rollovers_Layer-1-ov-10.gif'); return true;"
onmouseup="changeImages('Art_Rollovers_Layer_1008', 'images/Art-Rollovers_Layer-1-ov-10.gif'); return true;">
<img src="images/Art-Rollovers_Layer-1-14.gif" width="121" height="98" border="0" alt=""></a></td>
<td>
<img src="images/spacer.gif" width="1" height="10" alt=""></td>
</tr>
<tr>
<td rowspan="3">
<img src="images/Art-Rollovers_12.gif" width="80" height="263" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="88" alt=""></td>
</tr>
<tr>
<td rowspan="2">
<img src="images/Art-Rollovers_13.gif" width="121" height="175" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="146" alt=""></td>
</tr>
<tr>
<td>
<img src="images/Art-Rollovers_14.gif" width="478" height="29" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="29" alt=""></td>
</tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>Thanks
