Hello All,
I'm just learning AJAX and using advanced options that Scriptaculous
offers. I'm learning quick but having a few growing pains.
The site www.dynamicpowerinnovation.com is under progress and on the
home page I'm doing a flash-style image script with three thumbnails
to change between images. The problem I'm having is sometimes when you
mouse over one of the thumbs, the background image fades but the new
image never appears. This appears to be random because if I mouse over
again, the new image appears.
I'm still using primitive code so please take a look...
'slide1', 'slide2' and 'slide3' are the thumb image ID's, and flash-
slidex... respectively is the main image that fades and appears.
I just recently added the .setStyle( {opacity:1}); to see if that
helped. Thanks for any advice I'm stumped! Each mouseover checks to
see if one of the other two main images are visible and if so, fades
them out and simultaneously appears the desired slide. Works awesome
without the glitch....
// Setup Mouse hover events for action script on home pag
$('slide1').observe('mouseover', function(event) {
event.stop();
if( $('flash-slide2').display == "" || $
('flash-slide2').style.visibility == "" )
new Effect.Fade('flash-slide2',
{ duration: .75 } );
if( $('flash-slide3').display == "" || $
('flash-slide3').style.visibility == "" )
new Effect.Fade('flash-slide3',
{ duration: .75 } );
$('flash-slide1').setStyle( {opacity:1});
new Effect.Appear('flash-slide1', {duration: .
75} );
});
$('slide2').observe('mouseover', function(event) {
event.stop();
if( $('flash-slide1').display == "" || $
('flash-slide1').style.visibility == "" )
new Effect.Fade('flash-slide1',
{ duration: .75 } );
if( $('flash-slide3').display == "" || $
('flash-slide3').style.visibility == "" )
new Effect.Fade('flash-slide3',
{ duration: .75 } );
$('flash-slide2').setStyle( {opacity:1});
new Effect.Appear('flash-slide2', {duration: .
75} );;
});
$('slide3').observe('mouseover', function(event) {
event.stop();
if( $('flash-slide1').display == "" || $
('flash-slide1').style.visibility == "" )
new Effect.Fade('flash-slide1',
{ duration: .75 } );
if( $('flash-slide2').display == "" || $
('flash-slide2').style.visibility == "" )
new Effect.Fade('flash-slide2',
{ duration: .75 } );
new Effect.Appear('flash-slide3', {duration: .
75} );
});
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---
