5

Is there a way to just rewrite the JQuery fadeIn() and fadeOut() functions to use CSS3 Transitions when the browser supports it.

I'm using jquery transit for all other animations and I'm more comfortable with the fadeIn and fadeOut functions of Jquery but they don't run as well.

Here's a link to the site I'm working on

eg;

if(CSS3TransitionsAvailable){

$.fn.fadeIn() = function(this, speed, callback){

//Fade this in Using CSS3 Transistions
}

}

Thanks

4

2 回答 2

3

如果你想用 jQuery Transit 替换 jQuery 的 fadeIn 和 fadeOut 函数，你可以这样做：

$.fn.fadeOut = function(speed, callback)
{
    var transitionSpeed = typeof (speed) == "undefined" ? 1000 : speed;    
    $(this).transition({opacity: 0 }, transitionSpeed, callback);

};

$.fn.fadeIn = function(speed, callback)
{
    var transitionSpeed = typeof (speed) == "undefined" ? 1000 : speed;    
    $(this).transition({opacity: 1 }, transitionSpeed, callback);

};

$("div").on("click", function () 
{
    //Fade out for 4 seconds, then fade in for 6 seconds
    $(this).fadeOut(4000, myCallBackFunction);
});

function myCallBackFunction () 
{
        $(this).fadeIn(6000);

}

JS 小提琴演示

它并不完美，但您可以根据自己的喜好进行调整。

于 2013-05-03T16:17:53.940 回答
1

看看这个插件。它可能会帮助你。

于 2012-09-13T10:17:17.743 回答