我想实现一个侧面滚动图像滑块,就像在这里找到的那样
我无法让我的图像像示例中的那样滚动。这仅适用于 iPhone 屏幕分辨率。
这是我的代码:http: //jsfiddle.net/AYj6w/
<script type="javascript">$(document).ready(function() {
$('#product-image').mousewheel(function(e, delta) {
this.scrollLeft -= (delta * 40);
e.preventDefault();
});
});
</script>
<ul id="scroller">
<li><img src="img/products/black-couch.jpg"></li>
<li><img src="img/products/brown-couch.jpg"></li>
<li><img src="img/products/red-couch.jpg"></li>
</ul>
#scroller {
float: left;
width: 90%;
height: 77px;
}
#scroller ul {
width: 100%;
}
#scroller li {
list-style: none;
float: left;
width: 122px;
height: 71px;
}
#scroller img {
width: 100%;
height: 100%;
float: left;
}