2013-03-23 162 views
3

我希望能夠通過鍵盤按鍵滾動顯示ul列表。 經過一番嘗試,我得到了這個工作。在鍵盤上自動滾動向上/向下箭頭

不幸的是我遇到了很長的列表問題。 我想通過提供css規則溢出來滾動它們:auto;

鍵盤輸入仍然正確計算,但滾動條不滾動。 有人可以指定我怎麼能找到一個解決方案,需要時使用鍵盤輸入自動滾動?

我的HTML:

<div class="btn-group"> 
<a class="btn dropdown-toggle" data-toggle="dropdown" href="#"> 
Inch        
</a> 

<ul class="dropdown-menu"> 
    <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> 
    <li>10</li> 
    <li>11</li> 
    <li>12</li> 
    <li>13</li> 
    <li>14</li> 
    <li>15</li> 
    <li>16</li> 
    <li>17</li> 
    <li>18</li> 
    <li>19</li> 
</ul> 
</div> 

我的CSS:

ul{ 
    list-style-type:none; 
    max-height:110px; 
    overflow:auto; 
    text-align:center; 
} 

.selected{ 
    background:#ff0000; 
} 

我建立了一個的jsfiddle環境,展現我的代碼:

http://jsfiddle.net/Ugkxk/6/

回答

-1

這個jQuery .scrollTo(): plug-in應該能夠來幫你。

的你可以做什麼的一些例子:

$('body').scrollTo('#target'); // Scroll Screen to Target Element 

$('body').scrollTo(500); // Scroll Screen 500px Down 

$('#scrollable').scrollTo(100); // Scroll Individual Element 100px Down 

的最後一個例子可能是你所需要的。

+0

我實現了第一個例子,結果非常好。 我的結果可以在: http://jsfiddle.net/Ugkxk/9/ – 2013-03-24 11:02:57

+0

我很高興我幫助,祝你好運與未來的發展! – bukka 2013-03-24 11:04:44

+0

僅供參考:我剛剛在Google Chrome和Firefox中檢查了這個小提琴,如果您將鼠標光標懸停在列表上,它將無法使用。同時滾動頂部或底部不會選擇最後一個/第一個項目。 – nevf 2013-03-26 20:21:15

相關問題