CODEWITHSUNDEEP
jqueryjquery-pluginsjquery-mobilescrollview
Faizan Ali
Faizan Ali

Reputation: 509

Jquerymobile Scrollview comes backs to original position after scrolling.does not holds the scrolled position

I am using jquerymobile and scroll view to enable horizontal scrolling on a div. but I am having problem with it that when I lift my finger up after scrolling. It comes back to original position and the item I wanted to select cannot be selected as the scrolled content cannot be selected. here is my code

<div data-scroll="x" style="min-width:10000px; width: auto !important; width: 10000px;border: solid 1px black; white-space: nowrap;">
<div style="width: 350px; float: left;margin-left: 60px;">
             <div data-role="collapsible" data-collapsed="true" data-iconpos="bottom">
                 <h3>Morning</h3>
             </div>
             <div data-role="collapsible" data-collapsed="true" >
                 <h3>Afternoon</h3>
             </div>
             <div data-role="collapsible" data-collapsed="true" >
                 <h3>Evening</h3>
             </div>
         </div>
         <div style="width: 350px; float: left;margin-left: 60px;">
             <div data-role="collapsible" data-collapsed="true" >
                 <h3>Morning</h3>
             </div>
             <div data-role="collapsible" data-collapsed="true" >
                 <h3>Afternoon</h3>
             </div>
             <div data-role="collapsible" data-collapsed="true" >
                 <h3>Evening</h3>
             </div>

         </div>
         <div style="width: 350px; float: left;margin-left: 60px;">
             <div data-role="collapsible" data-collapsed="true" >
                 <h3>Morning</h3>
             </div>
             <div data-role="collapsible" data-collapsed="true" >
                 <h3>Afternoon</h3>
             </div>
             <div data-role="collapsible" data-collapsed="true" >
                 <h3>Evening</h3>
             </div>
         </div>


     </div>

So the items in the third inner divs cannot be selected as they cannot be reached while scrolling. anything I am doing wrong. ? I am using the default js files as on scrollview's demo page. also demos working fine using these js files

Upvotes: 1

Views: 529

Answers (1)

Blue
Blue

Reputation: 11

Knowing this is an old thread, it deserves an answer whatsoever. I encountered the same problem today using iscroll 4.2 with the latest version of iscrollview. Using the following fiddle: http://jsfiddle.net/Gajotres/952NJ/

Index page

<div data-role="content">
    <div class="example-wrapper" data-iscroll>
        <ul data-role="listview">
            <li><a href="#">Some link</a></li>
            <li><a href="#">Some link</a></li>  
    </div>          
</div>

<div data-theme="b" data-role="footer">
    <h1>Footer</h1>
</div>

I was able to get my code working. Apparently, iscrollview requires the different data-role divs: page, header, footer and content to work. So make sure, your code is placed within these tags.

Upvotes: 1

Related Questions