HTML當選項中的HTML選擇列表中選擇

Question

我有以下的HTML代碼垂直中心的選擇：

<select name="" id="listF" size="10"> 
     <option value="01">001</option> 
     <option value="02">002</option> 
     <option value="03">003</option> 
     <option value="04">004</option> 
     <option value="05">005</option> 
     <option value="06">006</option> 
     <option value="07">007</option> 
     <option value="08">008</option> 
     <option value="09">009</option> 
     <option value="10">010</option> 
     <option value="11">011</option> 
     <option value="12">012</option> 
     <option value="13">013</option> 
     <option value="14">014</option> 
     <option value="15">015</option> 
     <option value="16">016</option> 
     <option value="17">017</option> 
     <option value="18">018</option> 
     <option value="19">019</option> 
     <option value="20">020</option> 
     <option value="21">021</option> 
     <option value="22">022</option> 
     <option value="23">023</option> 
     <option value="24">024</option> 
    </select> 

和我有以下的JavaScript

$('#listF').click(function(){ 
    var n = 10; 
    if(this.selectedIndex < ($(this).find('option').length-n)) { 
    this.selectedIndex+=n; 
    this.selectedIndex-=n; 
    } 
}); 

選擇的HTML lenght是10 - 我希望無論何時我選擇垂直居中（不水平）的選項，都會顯示第5個

Option 1 
Option 2 
Option 3 
Option 4 
Option 5 
Option 6 
Option 7 
Option 8 
Option 9 
Option 10 

如果我選擇選項12 - 選項12將居中

Option 8 
Option 9 
Option 10 
Option 11 
Option 12 <<<<<Centered 
Option 13 
Option 14 
Option 15 
Option 16 
Option 17 

說我選擇選項7 - 選項7將居中

Option 3 
Option 4 
Option 5 
Option 6 
Option 7 <<<<<Centered 
Option 8 
Option 9 
Option 10 
Option 11 
Option 12 

我怎樣才能modiy我的JavaScript來達到這個目標？

我要垂直居中的<option>相對於<select>