Imageready Helpppppp!!! [Archive] - Lissa Explains it All: Web Design Forums

View Full Version : Imageready Helpppppp!!!

zed08

05-26-2006, 08:58 PM

I'm really confused about imageready.

I've already created my rollover image and saved it as html and image file - so I have an html file and a folder w/ the images in it.

What you do next is what i don't understand.

When I upload the images in photobucket, then do I also have to manually go through the code to change the location of the images, and then copy and paste the code onto my html editor (geocities)
OR
am i supposed to upload the html file somewhere - totally confused.

Also, is it true that you can create your whole web page with imageready (including the background you want and everything) and copy and paste the code to look exactly the same as your layout??
Any beginners tutorials that can help me??

Arwen

05-26-2006, 09:15 PM

Yes, you'll need to open your file and change the image locations. Then upload it to your server.

And I don't think it's possible to create a HTML page with ImageReady.

zed08

05-27-2006, 12:23 AM

I uploaded the file and images on geocities and when I open to preview the web page, the the pics don't appear. The naming is also right too. Can someone please try if this happens to them - create something on geocities and upload the file and images on geocities - what am i doing wrong??

zed08

05-27-2006, 01:14 AM

Below is the code generated by imageready. The image name format in imageready was ie. "images/testing_Layer-1-over.gif" while the image name format in geocities was ie. "testing_Layer-1-over.gif". I tried replacing the "images/" and although the images did show up for a little while, the rollover images did not. Please help!!!

zed08

05-27-2006, 01:16 AM

<html>
<head>
<title>testing</title>

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) {
testing_Layer_1_over = newImage("images/testing_Layer-1-over.gif");
testing_Layer_2_testing_Layer_1_over = newImage("images/testing_Layer-2-testing_Lay.gif");
testing_Layer_2_testing_Layer_1_over010 = newImage("images/testing_Layer-2-testing_-10.gif");
testing_Layer_2_testing_Layer_1_over011 = newImage("images/testing_Layer-2-testing_-11.gif");
testing_Layer_1_over015 = newImage("images/testing_Layer-1-over-15.gif");
testing_Layer_1_over019 = newImage("images/testing_Layer-1-over-19.gif");
preloadFlag = true;
}
}

// -->
</script>

zed08

05-27-2006, 01:17 AM

</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onload="preloadImages();">

<table id="Table_01" width="601" height="501" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="7">
<img src="images/testing_01.gif" width="600" height="11" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="11" alt=""></td>
</tr>
<tr>
<td rowspan="8">
<img src="images/testing_02.gif" width="35" height="489" alt=""></td>
<td rowspan="2">
<a href="#"
onmouseover="changeImages('testing_Layer_1', 'images/testing_Layer-1-over.gif', 'testing_Layer_2', 'images/testing_Layer-2-testing_-11.gif'); return true;"
onmouseout="changeImages('testing_Layer_1', 'images/testing_Layer-1.gif', 'testing_Layer_2', 'images/testing_Layer-2.gif'); return true;"
onmousedown="changeImages('testing_Layer_1', 'images/testing_Layer-1-over.gif', 'testing_Layer_2', 'images/testing_Layer-2-testing_-11.gif'); return true;"
onmouseup="changeImages('testing_Layer_1', 'images/testing_Layer-1-over.gif', 'testing_Layer_2', 'images/testing_Layer-2-testing_-11.gif'); return true;">
<img name="testing_Layer_1" src="images/testing_Layer-1.gif" width="78" height="96" border="0" alt=""></a></td>
<td colspan="5">
<img src="images/testing_04.gif" width="487" height="36" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="36" alt=""></td>
</tr>
<tr>
<td colspan="3" rowspan="2">
<img src="images/testing_05.gif" width="215" height="63" alt=""></td>
<td rowspan="6">
<img name="testing_Layer_2" src="images/testing_Layer-2.gif" width="257" height="304" alt=""></td>
<td rowspan="7">
<img src="images/testing_07.gif" width="15" height="453" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="60" alt=""></td>
</tr>
<tr>
<td>
<img src="images/testing_08.gif" width="78" height="3" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="3" alt=""></td>
</tr>
<tr>
<td colspan="3">
<a href="#"
onmouseover="changeImages('testing_Layer_2', 'images/testing_Layer-2-testing_-10.gif', 'testing_Layer_1014', 'images/testing_Layer-1-over-15.gif'); return true;"
onmouseout="changeImages('testing_Layer_2', 'images/testing_Layer-2.gif', 'testing_Layer_1014', 'images/testing_Layer-1-14.gif'); return true;"
onmousedown="changeImages('testing_Layer_2', 'images/testing_Layer-2-testing_-10.gif', 'testing_Layer_1014', 'images/testing_Layer-1-over-15.gif'); return true;"
onmouseup="changeImages('testing_Layer_2', 'images/testing_Layer-2-testing_-10.gif', 'testing_Layer_1014', 'images/testing_Layer-1-over-15.gif'); return true;">
<img name="testing_Layer_1014" src="images/testing_Layer-1-14.gif" width="83" height="104" border="0" alt=""></a></td>
<td rowspan="5">
<img src="images/testing_10.gif" width="210" height="390" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="104" alt=""></td>
</tr>
<tr>
<td colspan="3">
<img src="images/testing_11.gif" width="83" height="8" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="8" alt=""></td>
</tr>
<tr>
<td colspan="2">
<a href="#"
onmouseover="changeImages('testing_Layer_2', 'images/testing_Layer-2-testing_Lay.gif', 'testing_Layer_1018', 'images/testing_Layer-1-over-19.gif'); return true;"
onmouseout="changeImages('testing_Layer_2', 'images/testing_Layer-2.gif', 'testing_Layer_1018', 'images/testing_Layer-1-18.gif'); return true;"
onmousedown="changeImages('testing_Layer_2', 'images/testing_Layer-2-testing_Lay.gif', 'testing_Layer_1018', 'images/testing_Layer-1-over-19.gif'); return true;"
onmouseup="changeImages('testing_Layer_2', 'images/testing_Layer-2-testing_Lay.gif', 'testing_Layer_1018', 'images/testing_Layer-1-over-19.gif'); return true;">
<img name="testing_Layer_1018" src="images/testing_Layer-1-18.gif" width="82" height="108" border="0" alt=""></a></td>
<td rowspan="3">
<img src="images/testing_13.gif" width="1" height="278" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="108" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="2">
<img src="images/testing_14.gif" width="82" height="170" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="21" alt=""></td>
</tr>
<tr>
<td>
<img src="images/testing_15.gif" width="257" height="149" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="149" alt=""></td>
</tr>

zed08

05-27-2006, 01:17 AM