Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
<div class="container">
    <ul>
        <li>asdasd</li>
        <li>asdasd</li>
        <li>asdasd</li>
        <li>asdasd</li>
        <li>asdasd</li>
        <li>asdasd</li>
        <li>asdasd</li>
        <li>asdasd</li>
        <li>asdasd</li>
        <li>asdasd</li>
        <li>asdasd</li>
    </ul>
</div>
</body>
</html>
 
html,body{margin:0;padding:0;}
.container{
    margin-top:100px;
    background:yellow;
    height:600px;
    width:300px;
    overflow-y:auto;
    overflow-x:hidden;
    
}
.container ul{
    margin:0;
    padding:0;
    list-style:none outside none;
}
.container li{
    background:blue;
    display:block;
    height:150px;
    width:100%;
    padding:10px;
    margin-bottom:5px;
}
 
$(function(){
    $('.container li:nth-child(7)').css("background", "red");
    $('.container').animate({
        scrollTop: $('.container li:nth-child(7)').offset().top - $(".container").offset().top
    });
});
Output

This bin was created anonymously and its free preview time has expired (learn why). — Get a free unrestricted account

Dismiss x
public
Bin info
anonymouspro
0viewers