开发者

jQuery effects don't work when I add a speed

I'm pretty new to jQuery (and javascript for that matter), so this is probably just something stupid I'm doing, but it's really annoying me!

All I'm trying to do is add a speed to jQuery's hide and show functions. The code I'm using is:

for (var i in clouds) {
    $(clouds[i]).click(function() {
    $(this).hide();
    });
}

to hide clouds when they're clicked on, and

function fadeLogo(state) { 
    var element=document.getElementById('logo');

    if (state=='home') {
        element.hide;
        element.src='images/home.png';
        element.show;
    }

    else {
        element.hide;
        element.src='images/webNameLogo.png';
        element.show;
    }
}

to hide an image, change it and then show it again. This is called by

onMouseOver=fadeLogo('home') onMouseOut=fadeLogo('logo')

This works fine, but happens instantaneously. Whenever I try to include a speed, either as 'slow', 'fast' or in milliseco开发者_开发百科nds, it won't work, they just stay in their original states. Even adding hide() without a speed throws up an error in Safari's error console:

TypeError: Result of expression 'element.hide' [undefined] is not a function.

No errors are reported for the clouds, they just sit there not doing anything!

Hope someone can help!

Thanks

EDIT:

Now have this for the image change:

$(function() { //This function fades the logo to the home button on mouseover

    $('.logo').hover(function() {
        $(this).fadeOut(
            'slow',
            function () {
                $(this).attr ('src','images/home.png').fadeIn('slow');
            });
    }, function() {
        $(this).fadeOut(
            'slow',
            function () {
                $(this).attr('src','images/webNameLogo.png').fadeIn('slow');
            });
    });
});

Which fades the image out and in no problem, but doesn't change between the 2 images... Oops, should have been #logo. Got that one working now, onto the pesky clouds...


The hide() method is used like so:

for (var i in clouds) {
    $(clouds[i]).click(function() {
    $(this).hide( 'slow' ); // or you can pass the milliseconds
    });
}

As for the image hiding you should do something like this:

$( 'selector for your image' ).hide (
    'slow',
    function () {
        $( this ).attr ( 'src', 'images/other.png' ).show ( 'slow' );
    }
);
0

上一篇:

下一篇:

精彩评论

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

最新问答

问答排行榜