怎么实现这种图片效果？

Question

点击左右按钮可以实现图片转换，而不是轮播图那种，这效果具体是怎么实现的？用到bootstrap吗

Answer 1

var now = 0; //图片当前的索引；就是当前播放的是第几张图片
var index = 0; //标记的索引
var len = img.length; //图片的长度
left.onclick = function(){

if（now==0）{//如果当前是第一张，点击之后变成最后一张
    now = len;
}
now--;

}
right.onclick = function(){//如果当前是最后一张，点击之后就显示第一张

if(now == len-1){
    now=-1;
}
now++;
   

}

Answer 2

说到底还是轮播..只不过去掉自动切换改成点击切换啦~可以参考楼上其他答案~或者自己看一下swiper的api文档

Answer 3

http://sc.chinaz.com/tag_jiao... 这个网站能满足你

Answer 4

效果没看出来啊。有网址吗？贴一下， 或者看一下楼上的吧。

Answer 5

请贴网址

Answer 6

键盘左右键需要获取键盘的keycode http://www.runoob.com/jsref/e... 然后判断这个值是否是左右键就好

Answer 7

还是轮播，只不过是去掉自动切换、加上键盘事件监听的轮播~
比如：http://www.swiper.com.cn/api/...
你试试按几下左右键，不就是这种效果么。

Answer 8

监听keydown事件,并查看其keycode.
左右箭头的keycode分别是:
左: 37
右: 39

参考地址

Answer 9

这其实算是一个手动轮播样式，和自动轮播的区别就是键盘和手动（click）触发而非setInterval或者setTimeout触发而已bootstrap估计是不行，你试着找找网上的demo吧，改一下就是了。

Answer 10

Swiper就可以吧

Answer 11

这个效果很简单的，你去swiper好好读读api，里面有解决方法的。