<!DOCTYPE html>
<html>
<!--结构-->
<div id="example">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
</ul>
</div>
<!--样式-->
<style>
html,body
{
margin : 0;
padding: 0;
}
#example
{
width : 500px;
height: 500px;
background-color: #E9E9E9;
overflow-y: hidden;
}
ul
{
padding: 0;
margin : 0;
width: 100%;
background-color: #666;
}
li
{
width : 100%;
height: 100px;
background-color: black;
border-bottom: 1px solid #FFF;
text-align: center;
line-height: 100px;
font-size: 30px;
color: #FFF;
list-style: none;
opacity: 0.6;
}
</style>
<!--代码-->
<script>
window.onload = function()
{
var iscroll = new IScroll('#example')
}
</script>
<script src="src/iscroll.js"></script>
</html>
<!DOCTYPE html>
<html>
<!--结构-->
<div id="example">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
<!--样式-->
<style>
html,body
{
margin : 0;
padding: 0;
}
#example
{
width : 500px;
height: 500px;
background-color: #E9E9E9;
overflow: hidden;
}
ul
{
padding: 0;
margin : 0;
width: 1500px;
height: 500px;
background-color: #666;
}
li
{
width : 500px;
height: 500px;
float: left;
background-color: black;
text-align: center;
line-height: 500px;
font-size: 100px;
color: #FFF;
list-style: none;
}
</style>
<!--代码-->
<script>
window.onload = function()
{
var iscroll = new IScroll('#example',{snap:true,scrollX:true,scrollY:true})
}
</script>
<script src="src/iscroll.js"></script>
</html>
