Jquery 顺序淡入和淡出 - 同一位置

发布于 2024-09-29 15:17:24 字数 844 浏览 1 评论 0原文

我有三张图片，我希望它们是

第一张图片： fadeIn，稍等片刻，然后fadeOut；第二张图：（在同一个地方） fadeIn，稍等片刻，然后fadeOut；第三张图：（在同一个地方）淡入，稍等片刻，然后淡出；

//做点什么...

到目前为止我有这种愚蠢的行为。

 $(document).ready(function() {

            $('#imagemIntro1').fadeIn(3800);

            setTimeout(function() {
            $('#imagemIntro1').fadeOut(3800); }, 8000);



            $('#imagemIntro2').fadeIn(3800);

            setTimeout(function() {
            $('#imagemIntro2').fadeOut(3800); }, 8000);




            $('#imagemIntro3').fadeIn(3800);

            setTimeout(function() {
            $('#imagemIntro3').fadeOut(3800); }, 8000);


            window.location.replace("http://www.something.com");


        });

我可以请你帮忙吗？

我很想学习如何在没有特定插件的情况下做到这一点......：D “我的时间不多了，所以，我将使用建议的插件，因为这真的没什么特别的。”

提前致谢， MEM

原文

I have three images and I would like them to

First Image:
fadeIn, wait a while, then fadeOut;
Second Image: (on the same place)
fadeIn, wait a while, then fadeOut;
Third Image: (on the same place)
fadeIn, wait a while, then fadeOut;

//do something...

I have this stupidity so far.

 $(document).ready(function() {

            $('#imagemIntro1').fadeIn(3800);

            setTimeout(function() {
            $('#imagemIntro1').fadeOut(3800); }, 8000);



            $('#imagemIntro2').fadeIn(3800);

            setTimeout(function() {
            $('#imagemIntro2').fadeOut(3800); }, 8000);




            $('#imagemIntro3').fadeIn(3800);

            setTimeout(function() {
            $('#imagemIntro3').fadeOut(3800); }, 8000);


            window.location.replace("http://www.something.com");


        });

Can I have your help please?

I would love to learn how to do this, without a specific plugin... :D
"I'm running out of time, so, I will use the suggested plugin since, this is really nothing special."

Thanks in advance,
MEM

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

秋风の叶未落 2024-10-06 15:17:24

看来您在循环浏览某些图像方面走在正确的轨道上。但是，您的描述中似乎没有任何特殊要求。因此，我强烈推荐 jQuery Cycle 插件。

如果你想自己做，请更新你的OP。

回复收藏 0 原文

忆梦 2024-10-06 15:17:24

您想要做的是使用回调来执行此操作。你最终会得到一条相当丑陋的链条，但它确实有效。它看起来像这样：

function fadeInNowAndOutLater(sel, callback) {
    $(sel).fadeIn(3800, function() {
        window.setTimeout(8000, function(){$(sel).fadeOut(3800, callback);})
    });
}

fadeInNowAndOutLater('#imagemIntro1', function() {
    fadeInNowAndOutLater('#imagegIntro2', function(){
        fadeInNowAndOutLater('#imagegIntro3', function(){
            // do something...
        });
    });
});

What you want to do is use callbacks to do this. You end up with a pretty ugly chain, but it works. It would look something like this:

function fadeInNowAndOutLater(sel, callback) {
    $(sel).fadeIn(3800, function() {
        window.setTimeout(8000, function(){$(sel).fadeOut(3800, callback);})
    });
}

fadeInNowAndOutLater('#imagemIntro1', function() {
    fadeInNowAndOutLater('#imagegIntro2', function(){
        fadeInNowAndOutLater('#imagegIntro3', function(){
            // do something...
        });
    });
});

回复收藏 0 原文

~没有更多了~