Question

如何随意轮换图像,而不必用固定时间更新网页?

j)

  var bannerImages = new Array( );

  bannerImages[0] = "Banner1.jpg";
  bannerImages[1] = "Banner2.jpg";
  bannerImages[2] = "Banner3.jpg";
  bannerImages[3] = "Banner4.jpg";

  var randomImageIndex = Math.round( Math.random( ) * 3 );
  document.write( "<img alt="" src="imgs/" + bannerImages[randomImageIndex] + "">" );

`

Answer 1

Just change the src attribute of the image:

<img id="pic" src="http://jsfiddle.net/favicon.png" />

function changeImage()
{
    var bannerImages = new Array( );

    bannerImages[0] = "http://jsfiddle.net/favicon.png";
    bannerImages[1] = "http://jsfiddle.net/img/logo.png";
    bannerImages[2] = "http://jsfiddle.net/img/info-close.png";

    var image = document.getElementById( pic );
    var randomImageIndex = Math.floor( Math.random( ) * bannerImages.length );
    image.src = bannerImages[randomImageIndex];
}
window.setInterval(changeImage, 1000);

Try it: 。

Answer 2

利用JqueryRotate plugin,我们可以轻易和安放;更顺利,,只有1个图像。

e.g-

var angle = 0;
setInterval(function(){
      angle+=3;
     $("#img").rotate(angle);
},50);

<http://jsfiddle.net/73pXD/“rel=”nofollow> http://jsfiddle.net/73pXD/。

Ref: jquery-plug-in &<codes here/a>。

友情链接