Auto scroll while selecting checkbox from div using javascript
<p>i have two division tag one for maintain overflow content and another contain the check box 
 when i click any check box i just need to scroll bar depending up on the check box 
 i.e there is 20 check box, 9-10 are visible, if you want other then you have to scroll scroll bar, but i want functionality like when i click on 9 check box and the user want to go forward then 10 check box come up automatic. this functionality already provided in hot mail for selecting the mail. </p>

<p>for that one i have use following </p>

<pre><code>&lt;div&gt;
&lt;div id="text" style="width: 500px; height:200px; border: solid 1px grey; overflow: scroll;"&gt;
    &lt;input id="check1" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll1&lt;br&gt;
    &lt;input id="check2" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll2&lt;br&gt;
    &lt;input id="check3" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll3&lt;br&gt;
    &lt;input id="check4" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll4&lt;br&gt;
    &lt;input id="check5" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll5&lt;br&gt;
    &lt;input id="check6" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll6&lt;br&gt;
    &lt;input id="check7" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll7&lt;br&gt;
    &lt;input id="check8" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll8&lt;br&gt;
    &lt;input id="check9" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll9&lt;br&gt;
    &lt;input id="check10" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll10&lt;br&gt;
    &lt;input id="check11" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll11&lt;br&gt;
    &lt;input id="check12" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll12&lt;br&gt;
    &lt;input id="check13" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll13&lt;br&gt;
    &lt;input id="check14" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll14&lt;br&gt;
    &lt;input id="check15" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll15&lt;br&gt;
    &lt;input id="check16" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll16&lt;br&gt;
    &lt;input id="check17" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll17&lt;br&gt;
    &lt;input id="check18" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll18&lt;br&gt;
    &lt;input id="check19" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll19&lt;br&gt;
    &lt;input id="check20" type="checkbox" onclick="update(this.id)"&gt;Auto-scroll20&lt;br&gt;
    &lt;script type="text/javascript"&gt;
        function update(checkID) {
            var box = document.getElementById("checkID");
            var tag = document.getElementById("text");
            tag.scrollTop = tag.scrollTop - 17;
            setTimeout('update(checkID)', 1000);
        }
    &lt;/script&gt;
&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>how to scroll scroll bar when user select check box from the list 
 and also if user selecting forward than scroll down or user select backward than scroll up    as per the user requirement </p>

<p>please help me 
thanks in advance ...</p>
