Question

我想创建一个javascript源，将文件夹中的所有图片加载为我div的backgroundImage

<script type="text/javascript">
    $(document).ready(function() {
        $('body').css('background-image', 'url(/web/images/001.png)');
    });
</script>

如何将我的文件夹（网页/图片）中的所有图片（.png）加载为div的背景图片？

感谢您的支持，微米。

Answer 1

尝试这样的事情：

$(document).ready(function() {
    var imgno=1;
    for(var imgno=1;imgno<50;imgno++){
       $('div').css({'width':'200px','height':'200px','background-image': 'url(/web/images/'+imgno+'.png)'});
    }

});

Answer 2

引用此链接https://stackoverflow.com/a/18480589/4599982，您可以使用jquery setTimeout（settimeout ）函数在特定时间后更改背景。

Answer 3

如果您想使用间隔更改背景，请尝试使用

$(document).ready(function() {
    // Function to add leading zeroes
    function pad(num, size) {
        var s = num + "";
        while (s.length < size) s = "0" + s;
        return s;
    }

    // Variable to store the current image index
    var currentIdx = 1; 
    var max = 200; // Qtd of images in the folder

    setInterval(function() {
        // Reset the index when overflow
        if(currentIdx > max) currentIdx = 1;
        // Change the background
        $('body').css('background-image', 'url(/web/images/' + pad(currentIdx,4) + '.png)');
        currentIdx ++;
    }, 5000); // 5000ms == 5 seconds
});

这是Working Sample

使用Javascript从文件夹加载background.image序列

3 个答案: