javascript - jQuery get the total position from an id -
i want set focus position on variable #id after ajax reloads content within container. container has overflow:auto; in see scrollbar if content large. after inserting new content, can't focus set on #id i'm giving set on.
i first tried set focus on id:
<script type="text/javascript"> function setfocus(ulid) { var heightul = $("#"+ulid).offset(); $("#"+ulid).focus(); } </script> later tried total height of id, put offset() on it, $("#"+ulid).offset().top; or $("#"+ulid).position().top;.
function setfocus(ulid) { var heightul = $("#"+ulid).offset().top; $("#"+ulid).stop().animate({ scrolltop: heightul }, 'fast'); } but isn't working either. position() 0 in return , offset() returns object's height relative parent. , not total height object positioned within container.
the html:
<div class="info-container edit" id="info-container-edit"> <span class="cat">info 1</span> <ul id="info1" class="cat-list music"> <li>...</li> <li>...</li> <li>...</li> <li>...</li> </ul> <span class="cat cat">info 2</span> <ul id="info2" class="cat-list music"> <li>...</li> <li>...</li> <li>...</li> <li>...</li> </ul> <span class="cat cat">info 3</span> <ul id="info3" class="cat-list music"> <li>...</li> <li>...</li> <li>...</li> <li>...</li> </ul> <span class="cat cat">info 4</span> <ul id="info4" class="cat-list music"> <li>...</li> <li>...</li> <li>...</li> <li>...</li> </ul> </div> the ajax code refreshes container #info-container-edit. problem example want focus on #info3 setfocus('info3');. seems returns height of #info2 , not total height container #info-container-edit till #info3.
can point out how fix problem? if can position height of #id within container, should problem fixed. or how set display focus on #id?
you use .scrollintoview():
document.getelementbyid(ulid).scrollintoview(false);