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

0

Как и в названии, у меня есть приложение 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>
Теги:
cordova
jquery-mobile

1 ответ

0

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

  • 0
    Извините, я только что попробовал ... все еще не повезло
  • 0
    Пожалуйста, обновите код, который вы указали выше, с изменениями, которые вы только что внесли, и я еще раз посмотрю. Кроме того, какую версию JQuery Mobile вы используете?
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню