中国最全IT社区平台 联系我们 | 收藏本站
华晨云阿里云优惠2

Jquery集合

浏览声明

UI

分类插件

模态框

滚动轮播

拖拉排序

多选框

滚动条

Loading

移动端

提示框

功能性插件

瀑布流

  • CSS3立方体小照片
  • D3.js logo可视化库 D3.js
  • 图片处理

    banner特效

    jQuery超酷旋转轮播

    阅读 (2375)

    ie兼容10
    插件描述:jQuery旋转类型的轮播图

    原理

    • 先设想一个立方体,但是观看本轮播,发现不需要左右两个面,所以去掉左右两个面,留下前后上下4个面。用4个div表示。因为整体不涉及到左右两个面,所以没有左右面。

    • 每一张图片都可以切割成x个立方体,每一个立方体用一个li表示,然后这x个li的4个div的背景图片动态设置。

    • 同一个li里面所有div背景图片相同,通过background-position和js动态设置偏移量。可以控制整个图片的背景不乱。

    • var x=300;//此值代表旋转分成的块数,可以更改,越大效果越明显,分成的越多。建议不超过999.过大会出现卡顿现象。    

    大于一定图片可能不清晰。






    关闭
    程序员人生