接上篇，今天講解jQuery Tools中另一工具組件——滾動(dòng)效果（Scrollable）。滾動(dòng)效果在網(wǎng)頁設(shè)計(jì)中也是經(jīng)常用到的，例如滾動(dòng)新聞、幻燈片展示、相冊(cè)……（發(fā)揮想象力吧，用到選項(xiàng)卡的內(nèi)容切換中是不是會(huì)很酷）。

開始前還是要啰嗦幾句，jQueryTools關(guān)注的是提供靈活可控的功能，而非展現(xiàn)。雖然官方站點(diǎn)也給我們提供了漂亮的示例，但是那些展現(xiàn)與jQueryTools的核心功能無關(guān)。理解了jQueryTools的功能使用，展現(xiàn)效果及其擴(kuò)展任由發(fā)揮。例如今天要講的示例，可能并不好看，也不能直接用到Web設(shè)計(jì)中，示例僅僅要告訴你的是工具的使用方法，絕非準(zhǔn)則。

先看一個(gè)最簡(jiǎn)單的例子（你可以點(diǎn)擊方塊或按鍵盤左右鍵觸發(fā)滾動(dòng)）：

HTML 代碼：

<!-- 為scrollable區(qū)域定義一個(gè)根節(jié)點(diǎn) --> 
<div class="scrollable"> 
    <!-- 為所有滾動(dòng)項(xiàng)定義根節(jié)點(diǎn) --> 
    <div class="items"> 
        <div>0</div>  <div>1</div>  <div>2</div>  <div>3</div>  <div>4</div>  
        <div>5</div>  <div>6</div>  <div>7</div>  <div>8</div>  <div>9</div>  
        <div>10</div> <div>11</div> <div>12</div> <div>13</div> <div>14</div>  
    </div> 
</div>

it知識(shí)庫(kù)：jQuery Tools——不可錯(cuò)過的jQuery UI庫(kù)（五），轉(zhuǎn)載需保留來源！

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。