Scroll CheckboxList

Scroll CheckboxList

by Karen Maritz

HTML

<div id="MyDiv">
<div id="listDiv" ><ul>
        <li>list</li>
        <li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li>
        </ul></div>
    <div><ul>
        <li>list</li>
        
        <li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>This</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li><li>list</li>
        <li id='myRowID'>My Row</li>
        </ul></div>

</div>

CSS

div {
    width: 100px;
    height: 300px;
    border: 1px solid blue;
    overflow: auto;
}

#listDiv {background:#dfdfdf;}

JavaScript

var container = $('#MyDiv'),
    scrollTo = $('#myRowID');

container.animate({
    scrollTop: scrollTo.offset().top - container.offset().top + container.scrollTop()
});

/*
container.scrollTop(
    scrollTo.offset().top - container.offset().top + container.scrollTop()
);
*/