HI,
I have applied scrolling to the navigation bar using iscroll-4 (www.cubiq.org). It works fine with page refresh. But when i navigate to the different page, it stop working.
The code i have used is :
- <script src="./iscroll.js"></script>
- <script>
- $(document).ready(function(){
- FooNavScroll = new iScroll('footerwrapper',{hScroll: true, vScroll: false, hScrollbar: true });
- });
- </script>
- <body>
- <dev data-role="page">
- <div data-role="header">
- </div>
- <div data-role="content">
- </div>
- </div data-role="footer">
- <div id="footerwrapper">
- <div data-role="navbar" data_theme="a" data_iconpos="left" >
- <ul>
- <li>item1</li>
- <li>item2</li>
- <li>item3</li>
- <li>item4</li>
- </ul>
- </div>
- </div>
- </div>
- </div>
- </body>
this code works on each page if i have went there directly. but when i go through navigation then it doesnt work.
What i know is:
- $(document).ready(function(){
- FooNavScroll = new iScroll('footerwrapper',{hScroll: true, vScroll: false, hScrollbar: true });
- });
this function will not gonna call on each navigation it will only call on page refresh/new visit.
so i try to put this code in 'pageshow function like:
- $("div:jqmData(role='page')").live('', function () {
- FooNavScroll = new iScroll('footerwrapper',{hScroll: true, vScroll: false, hScrollbar: true });
- });
but this is not working at all.
can any one please tell me why this is happening?