jquery 360度旋转插件Rollerblade

 查看演示  website  立即下载

使用方法

在您的页面添加 rollerblade.css样式,由于文件很小，您可以拷贝和粘贴rollerblade.css内容到你的主CSS文件。

下一步：Rollerblade的目标容器元素的图像元素，那里面有“rollerblade-img”。第一张图像图像的路径。

<div id="target">
  <img class="rollerblade-img" src="path/to/first/image.jpg">
</div>

启动

确保jQuery是包含在你的页面,然后选择容器元素和rollerblade方法。至少你必须传入一组图像url作为属性选择的对象。属性必须被称为“imageArray”。

$(document).ready(function(){
    // You can specify an array of images outside of the rollerblade method,
    // and then pass it in, as so:
    var arrayOfImages = [
      'path/to/image/1.jpg',
      'path/to/image/2.jpg',
      'path/to/image/3.jpg',
      'path/to/image/4.jpg',
      'and/so/on.jpg'
    ]
    $("#target").rollerblade({imageArray:arrayOfImages});
    // OR you can create the array directly in the options object, as so:
    $("#target").rollerblade({imageArray:[
      'path/to/image/1.jpg',
      'path/to/image/2.jpg',
      'path/to/image/3.jpg',
      'path/to/image/4.jpg',
      'and/so/on.jpg'
    ]});
  })

PREVIOUS:
NEXT:
jquery动态阴影
画廊插件baguetteBox.js