使jquery函数在页面加载时运行 [英] Make jquery function run on page load

问题描述

我有一个jquery函数来更改鼠标悬停时图像的不透明度以产生脉动效果，但是我想对其进行更改，以使图像在页面加载后立即产生脉动，将鼠标悬停元素移到鼠标上方然后将鼠标移出.

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.

这是我的代码

    (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();
            }
        })
    });
}

来自 http://www.infinitywebcreations.com/2011 /01/如何通过jquery创建一个跳动的脉冲图像效果/

推荐答案

(function($) {
    $(document).ready(function() {
        window.pulse_image = $('.pulse_image');
        window.pulse_continue_loop = true;
        PulseAnimation(); // start the loop
    });
})(jQuery);​

这篇关于使jquery函数在页面加载时运行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！