魅族轮播图效果(原创)

所属分类:媒体-幻灯片和轮播图

 31886  324  查看评论 (3)
分享到微信朋友圈
X
魅族轮播图效果(原创) ie兼容10

使用方法

创建一个容器div例如

<div id='test'></div>

使用

$("#test').slide();

参数说明

image=["1.jpg","2.jpg"];
$("#text").slide({images:image,//图片数组
    autoPlay:true,//自动播放
    interval:6000,//图片间隔
    barColor:"#3498DB",//导航条颜色hiddenBar:false,//设置是否隐藏底部导航条hiddenControl:false//设置隐藏左右切换按钮
});
相关插件-幻灯片和轮播图

炫酷html5+css3响应式焦点图

炫酷html5+css3响应式焦点图,支持非响应前段布局。
  幻灯片和轮播图
 32428  340

原生js轮播图炸裂切换效果

原生js写的图片炸裂轮播图
  幻灯片和轮播图
 25660  314

HTML5全屏动画幻灯片切换

超炫酷HTML5响应式全屏幻灯片切换
  幻灯片和轮播图
 30150  411

SuperSlidev2.1焦点图幻灯片tab

SuperSlide 致力于解决网站大部分特效展示问题,使网站代码规范整洁,方便维护更新。 网站上常用的“焦点图/幻灯片”“Tab标签切换”“图片滚动”“无缝滚动”等只需要一个SuperSlide即可解决!
  幻灯片和轮播图
 46011  426

讨论这个项目(3)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    Gsdew 0
    2017/9/28 14:20:20

    请问怎么控制图片的显示数量为5

    回复
    匹|匹诺曹 0
    2017/7/5 9:53:11
    -果冻-- 0
    2017/4/28 16:09:19

    小建议:鼠标放上去的时候清除掉定时器,离开再执行定时器

    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复