PDA

View Full Version : Highlight Image Script - doesn't work in SAFARI?



slsmag
06-25-2006, 10:21 PM
I really like the Highlight Image Script and am using it on a nav bar that's made up of images (https://www.sittercafe.com/index.asp) . The affect is great on a PC but it doesn't work in SAFARI...

Anyone know of a script that will do the same thing (dim an image until onmouseover) but that is compatible with ALL browsers?

(http://www.dynamicdrive.com/dynamicindex4/image5.htm)

Thanks,

Michael

djr33
06-25-2006, 10:23 PM
I don't know if the opacity style is available in safari, and, yes, it doesn't work.
Not sure about another script... you could just do rollovers, with the "before" image looking like the desired effect... would immitate it well enough, anyway.

slsmag
06-25-2006, 10:27 PM
Using standard rollovers is an option - just trying to avoid it because it's double the overhead (twice as many images have to load into memory) and in general, this affect is faster than a rollover. But that's my fallback plan! Thanks.

- michael

djr33
06-25-2006, 10:31 PM
You could possibly do a browser detect, and then do rollovers if it's safari, but that's not the best way, because browser detects don't always work, etc.

Since the opacity thing may not exist in safari, there may be no way of doing that in it, without coming up with a totally different approach.

slsmag
06-26-2006, 10:53 PM
With no opacity option in Safari I've been forced to use rollover for compatibility. I chose the CSS 'style' rollover from Chris Poole (chrisdomroll.js) which allows the addition of a rollover by just adding a class call in the IMG tag. It works ok - but still has just a bit of 'lag' the first time the script is called.

I am pleased that I have been able to acheive the same "look". I don't think most site visitors will even notice the difference (except the MAC users of course, who will now see the nav buttons 'light up'. https://www.sittercafe.com/index.asp

Thanks for the encouragement.

jscheuer1
06-27-2006, 04:10 AM
Safari has generic opacity:


<img src="test.jpg" style="opacity:0.05;">