Question

我想在任何方向上制作一个动态自由的图像幻灯片（没有快照）。

我遇到iScroll4，这是一个很棒的脚本（适用于iOS和Android）。

JS CODE：

var myScroll;
function loaded() {

myScroll = new iScroll('wrapper', 
                { hScrollbar: false, 
                    vScrollbar: false,
                    snap:false,
                    vScroll: true,
                    hScroll: true
                     });
}

HTML CODE：

<div id="wrapper">
    <div id="scroller">
        <div id="thelist">
            <img id="theImg" src="https://www.google.com/images/srpr/logo4w.png" width="300px" height="200px">
        </div>
    </div>
</div>

CSS：

body,ul,li {
padding:0;
margin:0;
border:0;
}


#wrapper {
position:absolute; 
z-index:1;
top:-500px; 
bottom:0px; 
left:-500px;
width: 100%;
height: 100%;
overflow:auto;
background-color: red;
}

#scroller {
position:absolute; 
z-index:1;
padding:0;
width: 2000px;
height: 5000px;
background-color: blue;

}

#thelist {
list-style:none;
padding:0;
margin:0;
text-align:left;
background:none;
background-color: yellow;
}

#theContent {
background-color: grey;
}

#theImg {
position: relative;
top: 500px;
left: 500px;
}

我试图让包装器大于屏幕，因此图像可以在屏幕外滑动，然后使图像处于相对位置，因此它最初在屏幕上可见。

但我似乎无法摆脱顶部或左边的啪啪声。

我在这里做错了什么？

或者，是否有另一个可以完成相同工作的库？

使用iScroll在两个方向滚动

0 个答案: