jquery - 如何使用 jQuery 淡入/淡出五个 css 背景图像

标签 jquery css image background rotation

我目前正在使用它,它会旋转到下一张图片并重复 1-5

jQuery( function( $ ) {
    var images = [ "redesign/slides/Big_1.jpg", "redesign/slides/Big_2.jpg", "redesign/slides/Big_3.jpg", "redesign/slides/Big_4.jpg", "redesign/slides/Big_5.jpg"  ];
    var currentImage = 0;

    function changeBackground() {
        $( '#body_container' ).css( { backgroundImage: 'url(' + images[ ++currentImage ] + ')' } );
        if ( currentImage >= images.length - 1 ) {
            currentImage -= images.length;
        }
    }
    setInterval( changeBackground, 2000 );  
});

但是如何让图像淡入/淡出到下一张图像?

您可以在此处查看完整的主页:http://www.arcolacovenant.org/redesign_index

另外,如何让每张图片在显示时可以链接到不同的页面?

提前致谢。

最佳答案

如果您想要 slider ,请使用 slider 。字面上有成千上万。 nivo

如果你真的想自己做一个,只是为了学习如何做,甚至有成千上万的教程。关于如何制作 slider 的文章那么多,有round-up articles on all the articles .

关于jquery - 如何使用 jQuery 淡入/淡出五个 css 背景图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10843299/

相关文章:

jquery - 有条件地将第一个输入值反射(reflect)到第二个输入字段(基于复选框)

html - Flexbox justify-content-center 使内容出现在同一位置

html - 实现自定义 404 错误页面

database - NoSQL-适合存储图像吗?

jquery - 打开 select2 下拉菜单时禁用自动换行

javascript - 页面上有多个引导弹出窗口,但只有单击的第一个弹出窗口可以按需要工作

javascript - 使用 jquery 和 css 如何创建延迟的背景颜色变化动画?

javascript - 访问一个 Controller 的 ng-hide 值以在全局 Controller 中操作另一个 Controller 的 ng-style

java - 在将应用程序发布到市场之前在哪里保存图像?

node.js - node-gd 的复制功能无法识别