开发者

Replace Javascript click event with timed event?

I've found some javascript code that layers photos on top of each other when you click on them.

Rather than having to click I'd like the function to automatically run every 5 seconds. How can I change this event to a timed one:

$('a#nextImage, #image img').click(function(event){ 

Full code below. Thanks

$(document).ready(function() {
    $('#description').css({ 'display': 'block' });
    $('#image img').hover(
        function() { $(this).addClass('hover'); },
        function() { $(this).removeClass('hover'); }
    );

    $('a#nextImage, #image img').click(function(event) {
        event.preventDefault();
        $('#description p:first-child').css({ 'vi开发者_JAVA技巧sibility': 'hidden' });
        if($('#image img.current').next().length) {
            $('#image img.current').removeClass('current').next().fadeIn('normal').addClass('current').css({ 'position': 'absolute' });
        }
        else{
            $('#image img').removeClass('current').css({ 'display': 'none' });
            $('#image img:first-child').fadeIn('normal').addClass('current').css({ 'position': 'absolute' });
        }

        if($('#image img.current').width() >= ($('#page').width() - 100)) {
            xPos = 170;
        }
        else {
            do {
                xPos = 120 + (Math.floor(Math.random() * ($('#page').width() - 100)));
            } while(xPos + $('#image img.current').width() > $('#page').width());
        }
        if($('#image img.current').height() >= 300) {
            yPos = 0;
        }
        else{
            do {
                yPos = Math.floor(Math.random() * 300);
            } while(yPos + $('#image img.current').height() > 300);
        }
        $('#image img.current').css({ 'left' :xPos, 'top' :yPos });
    });
});


I'd try setInterval function. It runs something every N milliseconds. It looks like:

setInterval(function() {
  alert('5 seconds over!');
}, 5000);


$(document).ready(function() {
    $('#description').css({ 'display': 'block' });
    $('#image img').hover(
        function() { $(this).addClass('hover'); },
        function() { $(this).removeClass('hover'); }
    );

    setInterval(function() {
        $('#description p:first-child').css({ 'visibility': 'hidden' });
        if($('#image img.current').next().length) {
            $('#image img.current').removeClass('current').next().fadeIn('normal').addClass('current').css({ 'position': 'absolute' });
        }
        else{
            $('#image img').removeClass('current').css({ 'display': 'none' });
            $('#image img:first-child').fadeIn('normal').addClass('current').css({ 'position': 'absolute' });
        }

        if($('#image img.current').width() >= ($('#page').width() - 100)) {
            xPos = 170;
        }
        else {
            do {
                xPos = 120 + (Math.floor(Math.random() * ($('#page').width() - 100)));
            } while(xPos + $('#image img.current').width() > $('#page').width());
        }
        if($('#image img.current').height() >= 300) {
            yPos = 0;
        }
        else{
            do {
                yPos = Math.floor(Math.random() * 300);
            } while(yPos + $('#image img.current').height() > 300);
        }
        $('#image img.current').css({ 'left' :xPos, 'top' :yPos });
    }, 5000);
});
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜