私は周りを検索しようとしましたが、わかりやすいトピックが見つかりませんでした。 私はJavascriptや一般的なコーディングに慣れていません。jQuery-Mobile外部パネルは常にページ間で開きます
私はjqueryのモバイル1.4.5を使用していますが、これは私の問題です：
私は外部のパネルが正常に動作させることはできません。最初のページにパネルが表示されますが、ページを変更すると意図したとおりに表示されません。私の計画は、パネルをJqueryモバイルデモページと同じように動作させることです。
リンク：あなたはパネルが常に彼らが何であるかのページに関係なく表示されていない見ることができますJquery Mobile Demo
ここで、私は彼らがそのサイト上の外部パネルを使用していないが分かったが、それはまだ可能でなければなりません。私のサイトは、現時点ではどのように動作する
：
- パネルの作業だけで罰金、新しいページ（#page_kodiまたは#page_download）を入力すると、最初のページ（#page_home）
- をロードし、それが自動的に表示されません。思惑通り。
- 私は#page_kodiまたは#page_downloadを入力して、手動で意図したとおり、これは奇妙な部分です
- 起動したまま、それを持ち出す：私は（パネル開いて）から行くときは、（メインページを#page_homeする#page_kodiする#page_download ） できます。
- #page_homeから別のページに移動すると動作しません。
これは私のパネル用のJSコードですが、これを書くには良い方法があると確信していますが、そのいくつかは必要ありません。
Javascriptを：私は私のHTMLファイル内のすべてのこれらを配置している
<script>
<!-- Creates the panels & navbars/Tabs -->
$(document).on("pagecreate", function() {
$("body > [data-role='panel']").panel();
$("body > [data-role='panel'] [data-role='listview']").listview();
});
$(document).on("pageshow", function() {
$("body > [data-role='header']").toolbar();
$("body > [data-role='header'] [data-role='navbar']").navbar();
});
</script>
<script>
$(document).on("pagebeforeshow", function(event, data) {
$('#leftpanel').panel("open");
})
</script>
<script>
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)) {
$(document).on("pagebeforecreate", "#page_home", function() {
$("#leftpanel").panel({ dismissible: true });
$("#leftpanel").panel("close");
});
}
</script>
<script>
$(document).on("pagecreate", "#page_home", function() {
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)) {
setTimeout(function(){
$('#leftpanel').panel("close");
}, 500);
}
});
</script>
<script>
$(document).on("pagebeforecreate", "#page_home", function() {
$("#leftpanel").panel({ dismissible: false });
});
</script>
<script>
$(document).on("pagebeforecreate", "#page_download", function() {
$(".leftpanel").panel("option", "dismissible", false);
$('#leftpanel').panel("open");
});
</script>
<script>
$(document).on("pagebeforecreate", "#page_kodi", function() {
$("#leftpanel").panel("option", "dismissible", false);
$('#leftpanel').panel("open");
});
</script>
<script>
/* Left & Right swipe gestures to open panels*/
$(document).on("pagecreate", function() {
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)) {
$(document).on("swipeleft swiperight", function(e) {
if ($(".ui-page-active").jqmData("panel") !== "open") {
if (e.type === "swipeleft") {
$("#rightpanel").panel("open");
} else if (e.type === "swiperight") {
$("#leftpanel").panel("open");
}
}
});
}
});
</script>
。
HTMLパネル：それはあなたがJSを手動で設定する、またはので、私が読んだ時にどのような作品ですので、私はそれをこのように入れている
<div style="margin-top: 0px; background-color: #212120;" class="customlist panel-open" data-role="panel" data-position="left" data-dismissible="" data-display="overlay" data-theme="none" id="leftpanel">
<ul data-role="listview" data-inset="false">
MY CONTENT HERE
</ul>
</div>
データdismissible =「」。私がそれを偽にしたり、真実にしたりするとうまくいかなかった。
私がここでやろうとしていることは、常に大きな画面ではパネルを開き、小さい画面ではスワイプで開くようにすることです。これは今のところうまくいきます。私が抱えている問題は、ページを変更するときにパネルが意図したとおりに動作せず、フロントページから別のページに移動するときに閉じることです。パネル - - いくつかのポップアップ
page_download
page_kodi
page_home
：
PS：私はまた、このように私のページのうちの2つの間にパネルを入れています
あなたがテキストの壁に与えることができ、ごめんなさい、すべての助けを前もってありがとう。
'$（document）.ready'の中でパネルを作成してください。ご利用のページイベントを理解するには、[jQuery Mobileの "ページ"イベント - 何を、なぜ、どこで、いつ＆どのように？ "（https://jqmtricks.wordpress.com/2014/03/26）を読んでください。/jquery-mobile-page-events /） – deblocker
こんにちは、ありがとうございます。私は今それを読んだが、まだそれを働かせなかった。 ページを変更するとパネルが自動的に消えてしまい、ページを変更しても開いたままにしています。サイドナビゲーションバーとして。 あなたがリンクしたサイトのヒントでそれを見たが、正しく機能しません。何か案は？ – Connor
...もう1つのオプションは、1ページだけを使用し、コンテンツにajaxを使用することです。ここでは、外部パネルと応答のあるコンテンツを持つページを表示する謎です：http://jsfiddle.net/e6Cnn/38/ – deblocker