Jqmobile Pages - элементы со второй страницы видны на первой странице?

Question

Как и в названии, у меня есть приложение html 5, которое использует jqmobile и страницы для перехода к странице.

Переходы отлично работают ... единственная проблема заключается в том, что все элементы со второй страницы можно увидеть на первой странице! После того, как я переключаю страницы, переход работает отлично, и видны только элементы из второго div.

Кто-нибудь знает, что происходит? Может быть, мне не хватает дисплея: никого нет?

EDIT Вот некоторые из моих кодов.

<div data-role="page" id="page-one" data-title="Page 1" style = "padding-top:50px;"> 

      <div class = "pagecontent"> 
       <div id="nav"> 
        navbar 
       </div> 

       <div id="innerdiv"> 
        <div id="scroller" style="width:100%;height:100%;"> 

         <div id="pullDown"> 
          <span class="pullDownIcon"></span><span class="pullDownLabel">Pull down to refresh...</span> 
         </div> 

         <div id="container49"> 
          <div class="circlecontainer" id="circle" > 
           <div class = "gymname"> 
            Rec. Hall 
           </div> 
           <div class="animatedcircle"> 
            <canvas id="myCanvas" width="250" height="250"></canvas> 
           </div> 
           <div class="stationarycircle"> 
            <canvas id="myCanvas2" width="250" height="250"></canvas> 
           </div> 
           <div class="inner" id = "innerfour"> 
            <div class="count" id="count"><span id="counter"></span><span id="percent"></span></div> 
            <div class="line"></div> 
            <div class="fraction" id="fraction"><span id="attend"></span><span id="max"></span></div> 
           </div> 
           <div class = "oc" id ="oc1"> 
            CLOSED 
           </div> 
          </div> 


          <div class="circlecontainer" id="circle2" onclick="predictor(1)"> 
           <div class = "gymname"> 
            White Building 
           </div> 
           <div class="animatedcircle"> 
            <canvas id="myCanvas3" width="250" height="250"></canvas> 
           </div> 
           <div class="stationarycircle"> 
            <canvas id="myCanvas4" width="250" height="250"></canvas> 
           </div> 

           <div class="inner" id = "innerthree"> 
            <div class="count" id="count2"><span id="counter2"></span><span id="percent2"></span></div> 
            <div class="line"></div> 
            <div class="fraction" id="fraction2"><span id="attend2"></span><span id="max2"></span></div> 
           </div> 
           <div class = "oc" id="oc2"> 
            CLOSED 
           </div> 
          </div> 


          <div class="circlecontainer" id="circle3" onclick="predictor(2)"> 
           <div class = "gymname"> 
            IM Building 
           </div> 
           <div class="animatedcircle"> 
            <canvas id="myCanvas5" width="250" height="250"></canvas> 
           </div> 
           <div class="stationarycircle"> 
            <canvas id="myCanvas6" width="250" height="250"></canvas> 
           </div> 

           <div class="inner" id = "innertwo"> 
            <div class="count" id="count3"><span id="counter3"></span><span id="percent3"></span></div> 
            <div class="line"></div> 
            <div class="fraction" id="fraction3"><span id="attend3"></span><span id="max3"></span></div> 
           </div> 
           <div class = "oc" id="oc3"> 
            CLOSED 
           </div> 
          </div> 


          <div class="circlecontainer" id="circle4" onclick="predictor(3)"> 
           <div class = "gymname"> 
            Fitness Loft 
           </div> 
           <div class="animatedcircle"> 
            <canvas id="myCanvas7" width="250" height="250"></canvas> 
           </div> 
           <div class="stationarycircle"> 
            <canvas id="myCanvas8" width="250" height="250"></canvas> 
           </div> 

           <div class="inner" id = "innerone"> 
            <div class="count" id="count4"><span id="counter4"></span><span id="percent4"></span></div> 
            <div class="line"></div> 
            <div class="fraction" id="fraction4"><span id="attend4"></span><span id="max4"></span></div> 
           </div> 
           <div class = "oc" id = "oc4"> 
            CLOSED 
           </div> 
          </div> 
         </div><!-- content 49 --> 
        </div><!-- page content --> 

       </div><!-- poopie --> 
      </div><!-- scroller --> 

     <a href="#page-two" id="two" data-transition="slide"></a> 
     </div> 

<div data-role="page" id="page-two" data-title="Page 2"> 
<div class = "pagecontent"> 

<div id="date">0/0/00</div> 
<div id = "pattend">Predicted Attendance:</div> 
<div id="percent"><span id="percentage">0</span>%</div> 
<div id="displayattend">0</div> 

<div id="wrapping"> 
    <div id="linediv"> 
     <div id="time"><span id="hours"></span>:<span id="min"></span><span id="ampm"> </span></div> 
     <div id="line"></div> 
     </div> 

     <div id="chart1" style="height:100%;width:100%;"></div> 
    </div><!-- wrapping --> 
    </div><!-- Page Content --> 
</div> 

Answer 1

два места, которые вы должны <div class="pagecontent"> должны быть <div data-role="content">