1

I need to update the scrollbar location of a div within a series of jquery mobile data role pages.

My header:

<script src="js/jquery-1.6.4.min.js"></script>
<script src="js/jquery.mobile-1.0rc1.min.js"></script>
<script>
$(document).live('pageinit','[data-role=page]', function() {
    $("#toc_contentdown").scrollTop(200);
});
</script>

is supposed to update each data role page by scrolling down to a location in my table of contents div. You can view my demo page here: demo page

I am using jquery 1.6.4 and jquerymobile 1.0

This question was helpful in giving me ideas of how to initialize the jquery within the data role page: How to initialize pages in jquery mobile? pageinit not firing

so that gave me the idea to embed the jquery initializing code into each data role page:

<script>
$("#chp11").live('pageinit', function() {
    $("div#toc_contentdown").scrollTop(200);
});
</script>

where #toc_contentdown is the div I want the scrollbar to scroll down when the data role page is loaded. and #chp11 is the id of the data role page that should be currently loaded to initialize the scroll down.

Any ideas? I'm sure there's an easier way to do this that I'm not thinking of at the moment. I'm using $(document).live('pageinit' instead of '.bind' because I am using 1.6.

I would post the code of the full page, but it's just several similar data role pages .

Thanks in advance for any guidance!

Community
  • 1
  • 1
  • Alternatively, if there is a way to prevent the scrollbars on the table of contents div from scrolling to the top on every data role page load, that would work. Would event.preventdefault work in this scenario? – user2157983 Mar 13 '13 at 19:19

0 Answers0