Здравствуйте, есть такой код:
function search(){
var searchString = $('#search').val();
var element = $('#viewer div:contains("'+searchString+'")');
$('#viewer').animate({
scrollTop: $(element).offset().top - 30
}, 2000);
}
#viewer{
max-height: 200px;
position: absolute;
overflow-y: auto;
}
.search2{
margin-top: 1000px;
}
.search1{
margin-top: 500px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="search"><button onclick="search()">заскролить</button>
<div id="viewer">
<div><p>roll</p></div>
<div class="search1"><p>test1</p></div>
<div class="search2"><p>test2</p></div>
</div>
Почему при втором нажатии с такой же введенной строкой оно скролит вверх? и ещё если проскролить к test1 а потом к test2 то оно останавливается на половине пути