【问题标题】:Javascript Fullscreen Background Slideshow help needed需要Javascript全屏背景幻灯片帮助
【发布时间】:2015-07-10 05:10:43
【问题描述】:

我是 Javascript 新手,并且有一个几乎完美的代码,但需要根据我的需要进行一些调整。

现在这段代码在我的页面正文中生成一个全屏背景幻灯片,而我希望它完成完全相同的工作,但通过 ID 应用于特定的 div。如果可能的话,我也希望它可以选择随机化。

如果能提供任何帮助,我将不胜感激。谢谢。

<style>
body {
    background-attachment:fixed;
    background-repeat: no-repeat;
    background-size:cover;
    background-position: center;
}
</style>

<script language="JavaScript1.2">

    //Specify background images to slide
    var bgslides=new Array()
    bgslides[0]="images/tickets1.jpg"
    bgslides[1]="images/tickets2.jpg"
    bgslides[2]="images/tickets3.jpg"

    //Specify interval between slide (in miliseconds)
    var speed=3000

    //preload images
    var processed=new Array()
    for (i=0;i<bgslides.length;i++){
    processed[i]=new Image()
    processed[i].src=bgslides[i]
    }

    var inc=-1

    function slideback(){
    if (inc<bgslides.length-1)
    inc++
    else
    inc=0
    document.body.background=processed[inc].src
    }

    if (document.all||document.getElementById)
    window.onload=new Function('setInterval("slideback()",speed)')

</script>

【问题讨论】:

  • 你可以试试一些插件??

标签: javascript jquery background slideshow


【解决方案1】:

试试这个:

function slideback(){
       var imageToShow;
       imageToShow=$(bgslides).eq(Math.floor(Math.random() * bgslides.length)].src;
       document.body.background=imageToShow;
}

更新

function slideback(){
       var imageToShow;
       var imageToPick=pickRandrom(bgslides.length);
       imageToShow=$(bgslides).eq(imageToPick].src;
       document.body.background=imageToShow;
}

function pickRandom(range)
{
    if (Math.random)
           return Math.round(Math.random() * (range-1));
    else {
           var now = new Date();
           return (now.getTime() / 1000) % range;
    }
}

【讨论】:

  • 请原谅我的无知,但这应该是而不是现有的功能后退部分吗?我试过这样做,但似乎破坏了幻灯片。
  • 是的,应该是这样。中断幻灯片你是什么意思?
  • 它根本不再出现。我是否应该修改你给我的代码以使其适合?
  • 嗨,恐怕也没有运气!完全停止幻灯片放映:(
  • 你能提供一个小提琴吗??
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-09-05
  • 2018-01-08
  • 2013-09-09
  • 2011-06-28
  • 2011-03-26
相关资源
最近更新 更多