Response title
This is preview!
jquery mobile 1px line when page transition slide
in jQuery Mobile
•
9 years ago
I'm developing a jquery mobile app and I have a problem with this page.
The html has 3 pages: today, yesterday and tomorrow. When swipe left and right it moves between pages. Also I have a fixed div to show the current page. The problem is on the slide page transition there is a 1px line that runs through the fixed div.
I'm building the code using PhoneGap Build.
I don't know how to solve this, but is very bad when you see in a mobile device.
Here is the code and the pic of the line:
<body> <div data-role="page" id="page_live_today" data-theme="b"> <div data-role="header" data-position="fixed" data-tap-toggle="false" data-id="header" data-theme="a"> <h3>Directo</h3> </div> <div data-role="content"> <div class="fixed">HOY</div> <div> <p>Some text</p> </div> </div> </div> <div data-role="page" id="page_live_yesterday" data-theme="b"> <div data-role="header" data-position="fixed" data-tap-toggle="false" data-id="header" data-theme="a"> <h3>Directo</h3> </div> <div data-role="content"> <div class="fixed">AYER</div> <div> <p>Some text</p> </div> </div> </div> <div data-role="page" id="page_live_tomorrow" data-theme="b"> <div data-role="header" data-position="fixed" data-tap-toggle="false" data-id="header" data-theme="a"> <h3>Directo</h3> </div> <div data-role="content"> <div class="fixed">MAÑANA</div> <div> <p>Some text</p> </div> </div> </div> </body> .fixed { top: 44px; left: 0px !important; position: fixed; background: #ffffff; padding: 5px 0px 5px 0px; width: 100%; color: #333333; text-align: center; text-shadow: none; }
1