## 入門
你想成為iScroll大師。行，這就是我寫以下內容的目的。
最好的學習iScroll的方法是看示例。在存檔文件中你會發現一個叫做`demo`的文件夾[示例](https://github.com/cubiq/iscroll/tree/master/demos)。這里有大多數腳本功能的概述。
`IScroll`是一個類，每個需要使用滾動功能的區域均要進行初始化。每個頁面上的iScroll實例數目在設備的CPU和內存能承受的范圍內是沒有限制的。
盡可能保持DOM結構的簡潔。iScroll使用硬件合成層但是有一個限制硬件可以處理的元素。
最佳的HTML結構如下：
~~~
<div id="wrapper">
<ul>
<li>...</li>
<li>...</li>
...
</ul>
</div>
~~~
iScroll作用于滾動區域的外層。在上面的例子中，`UL`元素能進行滾動。只有容器元素的第一個子元素能進行滾動，其他子元素完全被忽略。
`box-shadow`,?`opacity`,?`text-shadow`?and alpha channels are all properties that don't go very well together with hardware acceleration. Scrolling might look good with few elements but as soon as your DOM becomes more complex you'll start experiencing lag and jerkiness.
Sometimes a background image to simulate the shadow performs better than?`box-shadow`. The bottom line is: experiment with CSS properties, you'll be surprised by the difference in performance a small CSS change can do.
最基本的腳本初始化的方式如下：
~~~
<script type="text/javascript">
var myScroll = new IScroll('#wrapper');
</script>
~~~
第一個參數可以是滾動容器元素的DOM選擇器字符串，也可以是滾動容器元素的引用對象。下面是一個有效的語法：
~~~
var wrapper = document.getElementById('wrapper');
var myScroll = new IScroll(wrapper);
~~~
所以基本上你要么直接傳遞元素，要么傳遞一個`querySelector`字符串。因此可以使用css名稱代替ID去選擇一個滾動器容器,如下:
~~~
var myScroll = new IScroll('.wrapper');
~~~
注意，iScroll使用的是`querySelector`?而不是?`querySelectorAll`，所以iScroll只會作用到選擇器選中元素的第一個。如果你需要對多個對象使用iScroll，你需要構建自己的循環機制。
You don't strictly need to assign the instance to a variable (`myScroll`), but it is handy to keep a reference to the iScroll.
For example you could later check the?[scroller position](https://iiunknown.gitbooks.io/iscroll-5-api-cn/content/gettingstart.html#scroller-info)?or?[unload unnecessary events](https://iiunknown.gitbooks.io/iscroll-5-api-cn/content/gettingstart.html#destroy)?when you don't need the iScroll anymore.
