1

この投稿と同じ問題があります。しかし、ソリューションは私のプロジェクトでは機能しません。

ASP.NET MVC4 と JQM を使用しています。head セクションに 1 つの JS ファイルをロードしました。私はこのようなメニューを持っています:

<a href="#left-panel" id="link-menu" class="ui-panel-animate"></a>
<div data-role="panel" id="left-panel" data-display="push">
  <ul data-role="listview">
   ...
  </ul>
</div>

私のリンクメニューのCSSクラス:

#link-menu
{
  top: 3px;
  position: absolute;
  background: url("images/icons-36-white.png"); 
}

イメージです、位置は絶対です。したがって、パネルが開いたら、追加する必要があります:

.Menu-decalage {
  -webkit-transform: translate3d(272px,0,0);
  -moz-transform: translate3d(272px,0,0);
  transform: translate3d(272px,0,0);    
}

私のJSファイルに追加しました：

$(document).on('pagebeforeshow', function () {
  $("#left-panel").panel({
    beforeopen: function (event, ui) {
        $("#link-menu").addClass("Menu-decalage");
    },
    beforeclose: function (event, ui) {
        $("#link-menu").removeClass("Menu-decalage");
    }
});

ナビゲーション後ではなく、最初のページが読み込まれたときに機能します。コードが最初のページで実行されることを理解しました。

$.mobile.activePage.find('#left-panel').panel();

しかし、うまくいきません。

変えてみました

$(document).on('pagebeforeshow', function () {

に

$(document).on('pageinit', function () {

しかし、activePage は定義されていません。

だから誰かが私に解決策を与えることができれば:ありがとう

4

2 に答える 2

-1

相対位置を指定してhtmlに画像を追加し、リンクの背景画像を削除することで解決策を見つけました。

ご協力いただきありがとうございます

于 2013-08-05T08:31:31.123 に答える