Imageready help?

[nivek_nailgun]

Hi guys...

Wondering if anyone here has ever used Adobe Imageready to create a page (thus have it write the javascript for you when you 'Save Optimized As' as html code.
I've done it a few times recently but the rollovers don't work as they should. It writes in a preloading code,but it does natta! I've got to mouse over and over and over before it kicks in....this obviously can't be correct. I'm a graphic designer,not a web programmer so I know very little javascript and really don't want this tool taken away because of some silly mistake.
Has anyone ever encountered this and if so,what is the remedy? Thanks....

m.

http://www.liquidmouse.cjb.net

[nivek_nailgun]

Hi guys...

Wondering if anyone here has ever used Adobe Imageready to create a page (thus have it write the javascript for you when you 'Save Optimized As' as html code.
I've done it a few times recently but the rollovers don't work as they should. It writes in a preloading code,but it does natta! I've got to mouse over and over and over before it kicks in....this obviously can't be correct. I'm a graphic designer,not a web programmer so I know very little javascript and really don't want this tool taken away because of some silly mistake.
Has anyone ever encountered this and if so,what is the remedy? Thanks....

m.

http://www.liquidmouse.cjb.net

[Jen Worden]

Welcome to Talk Graphics!

I've always found Image Ready's mouseover interface a tad confusing, but understand, I'm far more comfortable handcoding.

That said, when you create a mouseover, you require 2 images :

1. for the regular state (ie. mouseout) and
2. for the rollover (ie. mouseover)

In IR, make sure each button image is on a different layer then toggle between the two (first for "off", second for "on") in the Rollover palette.

This will save both images when you click "SAVE OPTIMIZED AS"

Good luck!

cfn ... Jen
Jen Worden
Web Developer
www.meadoworks.com

[nivek_nailgun]

Hiya and thanks for the welcome!
I'm actually originally from NB,Canada. [img]/infopop/emoticons/icon_smile.gif[/img]
Anywhoo....
Yeah,I don't have a problem 'making' ImageReady perform the task of rollovers/buttons,etc. I've done it and tested it on my computer (preupload) and it works great in the test phase. When it's uploaded and live,it doesn't do what it should at all. The preloading code simply doesn't work.
Here is what ImageReady gives me:

< !-- ImageReady Preload Script [bullseye.psd) -->
<script LANGUAGE="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) {
bullseye_02_bullseye_05_over = newImage("images/bullseye_02-bullseye_05_ove.gif");
bullseye_03_bullseye_15_over = newImage("images/bullseye_03-bullseye_15_ove.gif");
bullseye_04_bullseye_09_over = newImage("images/bullseye_04-bullseye_09_ove.gif");
bullseye_04_bullseye_05_over = newImage("images/bullseye_04-bullseye_05_ove.gif");
bullseye_05_over = newImage("images/bullseye_05-over.gif");
bullseye_05_down = newImage("images/bullseye_05-down.gif");
bullseye_07_bullseye_09_over = newImage("images/bullseye_07-bullseye_09_ove.gif");
bullseye_08_bullseye_09_over = newImage("images/bullseye_08-bullseye_09_ove.gif");
bullseye_08_bullseye_05_over = newImage("images/bullseye_08-bullseye_05_ove.gif");
bullseye_09_over = newImage("images/bullseye_09-over.gif");
bullseye_09_down = newImage("images/bullseye_09-down.gif");
bullseye_10_bullseye_09_over = newImage("images/bullseye_10-bullseye_09_ove.gif");
bullseye_13_bullseye_09_over = newImage("images/bullseye_13-bullseye_09_ove.gif");
bullseye_15_over = newImage("images/bullseye_15-over.gif");
bullseye_15_down = newImage("images/bullseye_15-down.gif");
bullseye_16_bullseye_15_over = newImage("images/bullseye_16-bullseye_15_ove.gif");
preloadFlag = true;
}
}

// -->

function MM_displayStatusMsg(msgStr) { //v1.0
status=msgStr;
document.MM_returnValue = true;
}
//-->
</SCRIPT>
< !-- End Preload Script -->

There it is. Again,this works PERFECTLY in my own browser until it's uploaded then bombs. Any ideas?
Thanks again.

http://www.liquidmouse.cjb.net

[Jen Worden]

Don't suppose you could post a URL? It's so much easier to troubleshoot when there's a working example.

Other things to check: Are your images, in fact, in the "images" directory? Have you put the preload function in the body tag? Are your mouseovers in the anchor tags correct?

cfn ... Jen
Jen Worden
Web Developer
www.meadoworks.com

[nivek_nailgun]

http://www.geocities.com/nivek_nailgun/bullseye.html

Allrighty,that's the address. Now you mentioned something about the images being in the image directory? I don't have separate directories made at geo,I just upload everything to the main open file. Again,I'm pretty much java-handicapped at this point in time.
Anywhoo,if you should see something assed-backwards please let me know as I'm about to rip my own eyebrows out! Thanks!

m.

http://www.liquidmouse.cjb.net

[Jen Worden]

Just disregard the images directory comment - from your posted code the rollovers were referenced as "images/whatever.gif" - obviously, you uploaded into the root. So, that's fine.

The problem however, stems from the fact that you are trying to change multiple images from one rollover. Cardinal rollover rule: both the mouseover state and the static state have to be the same pixel size (ie. 100 x 200), otherwise, it won't work.

I suspect that you had more than one slice selected when you created your rollovers or you sliced after they were created. Either way, until that's resolved, your rollovers won't function correctly.

Another tip: keep the rollover images as small as possible (ie. file size shouldn't be too much larger than 10k each) or it will take too long too load, thereby reducing the immediate mouseover effect.

Good luck!

cfn ... Jen
Jen Worden
Web Developer
www.meadoworks.com

[nivek_nailgun]

***The problem however, stems from the fact that you are trying to change multiple images from one rollover. Cardinal rollover rule: both the mouseover state and the static state have to be the same pixel size (ie. 100 x 200), otherwise, it won't work.
I suspect that you had more than one slice selected when you created your rollovers or you sliced after they were created. Either way, until that's resolved, your rollovers won't function correctly.
Another tip: keep the rollover images as small as possible (ie. file size shouldn't be too much larger than 10k each) or it will take too long too load, thereby reducing the immediate mouseover effect.***


Hm. Well,I import it into ImageReady and create the slices right there as well as the rollovers. Therefore,they are identical in size. I've only got one slice selected (I made sure of that) also.

Well,I'll check the file sizes to be sure....

thanks again,

m.

http://www.liquidmouse.cjb.net

[Jen Worden]

<BLOCKQUOTE><font size="-1">quote:</font><HR>Well,I'll check the file sizes to be sure....<HR></BLOCKQUOTE>

In this specific instance, m, I'm talking about the actual physical size. For example, take the "edit/delete" graphic on this board - it's 36 x 15pixels. You couldn't have a rollover for that image that was say, 45 x 20pixels and located below it.

I imported your page and when I moused over one of your links, not only was the code trying to replace that image but also 3 more located in different positions.

Does that make sense to you? If not, maybe I got the code wrong in which case, I'll take another look.

Something to be said for learning HTML after all. [img]/infopop/emoticons/icon_wink.gif[/img]

cfn ... Jen
Jen Worden
Web Developer
www.meadoworks.com

[nivek_nailgun]

Well....lol....

You may have imported the new page I put up. Well,same page,different code. I had readjusted it since I read your last post so it's more screwed up that it was in the first place. D'oh!

http://www.liquidmouse.cjb.net