Question

我之前在一个页面上运行多个幻灯片时得到了一些帮助，我现在的问题是让幻灯片在页面上工作/启动。

HTML：

<p align="center"><font size="2"><b>Companies Supporting<br />R&M Research:</b><br  />         (click logo for company info)</font></p>
        <p align="center"><a href="#" target="_blank"><IMG SRC="./images/schlumberger.gif" WIDTH="180" HIGHT="200" BORDER="0" NAME="bannerad1"></a>
</p>
       <br />

            <hr noshade="noshade" size="0" color="#4c617e" />
 <br />

        <p align="center"><font size="1"><b>Thank you to the following for<br />their MARCON '12 support</b><br />(click logo for company info)</font></p>
        <p align="center"><a href="#" target="_blank"><IMG SRC="./marcon/images/arms_reliability_logo.jpg" WIDTH="180" HIGHT="200" BORDER="0"   NAME="bannerad2"></a>
       <br />

 <br />

        <p align="center"><a href="#" target="_blank"><IMG SRC="./marcon/images/arms_reliability_logo.jpg" WIDTH="180" HIGHT="200" BORDER="0"   NAME="bannerad3"></a>

的Javascript

<script type="text/javascript">

var slideShow = function(imagesArray, hrefsArray, bannerad) {

var counter = -1, timer = null;

function banner() {
    counter++;
    if (counter > imagesArray.length-1) { counter = 0; }
    bannerad.src = imagesArray[counter];
    bannerad.parentNode.href = hrefsArray[counter];
}
timer = setInterval(banner, 6000);

};


var ads1 = [
    "./images/okuma.jpg",
    "./images/schlumberger.gif",
    "./images/uesystems_logo.jpg",
    "./images/brady.jpg",
    "./images/ats.png"
    ];


var newplace1 = [
    "http://www.okuma.com/home.html",
    "http://www.slb.com/",
    "http://www.uesystems.com/",
    "http://www.bradyid.com/bradyid/cms/contentView.do/6974/Visual-Workplace.html",
    "http://www.advancedtech.com/"
    ];


var ads2 = [
    "./marcon/images/arms_reliability_logo.jpg",
    "./marcon/images/brunson_logo.jpg",
    "./marcon/images/ctc_logo.jpg",
    "./marcon/images/descase_logo.jpg"
    ];


var newplace2 = [
    "http://www.globalreliability.com/home",
    "http://www.brunson.us",
    "http://www.ctconline.com/_home.aspx",
    "http://www.des-case.com"
    ];

var ads3 = [
    "./marcon/images/arms_reliability_logo.jpg",
    "./marcon/images/brunson_logo.jpg",
    "./marcon/images/ctc_logo.jpg",
    "./marcon/images/descase_logo.jpg"
    ];


var newplace3 = [
    "http://www.globalreliability.com/home",
    "http://www.brunson.us",
    "http://www.ctconline.com/_home.aspx",
    "http://www.des-case.com"
    ];


slideShow(ads1, newplace1, document.bannerad1);
slideShow(ads2, newplace2, document.bannerad2);
slideShow(ads3, newplace3, document.bannerad3);

</script>

我尝试使用：

<body onload="banner();">

但由于某种原因它不起作用。有什么想法吗？

Answer 1

window.onload=function() {
  slideShow(ads1, newplace1, document.bannerad1);
  slideShow(ads2, newplace2, document.bannerad2);
  slideShow(ads3, newplace3, document.bannerad3);
}

Answer 2

没有足够的声誉发表评论，所以我会把它放在答案中......

mplungjan的答案对我来说很好（只是用你的代码测试过），但是你必须删除<body onload="banner();">或JS运行错误。

banner()是slideShow“类”中的本地函数，从外部看不到。此外，它不需要被调用，setInterval()为你做。 ;）

幻灯片不会在加载时启动

2 个答案: