KnowledgeHub
Questions
Tags
Users
Search
Alex Rivera
|
Logout
Edit Question
Title
Body
I have a jquery function to change the opacity of an image on mouse hover to produce a pulsating effect, but I would like to change it so that the image pulsates as soon as the page loads, removing the mouse hover elements mouse over and mouse out. Here is the code I have (function($) { $(document).ready(function() { window.pulse_image = null; window.pulse_continue_loop = false; $('.pulse_image').mouseover(function() { // User is hovering over the image. window.pulse_continue_loop = true; window.pulse_image = $(this); PulseAnimation(); // start the loop }).mouseout(function() { window.pulse_continue_loop = false; window.pulse_image.stop(); window.pulse_image.css('opacity',1); }); }); })(jQuery); function PulseAnimation() { var minOpacity = .33; var fadeOutDuration = 650; var fadeInDuration = 650; window.pulse_image.animate({ opacity: minOpacity }, fadeOutDuration, function() { window.pulse_image.animate({ opacity: 1 }, fadeInDuration, function() { if(window.pulse_continue_loop) { PulseAnimation(); } }) }); } From http://www.infinitywebcreations.com/2011/01/how-to-create-a-throbbingpulsing-image-effect-with-jquery/
Tags (comma-separated)
Save Edits
Cancel