JQuery Mobile Panel - Связывание внутри страницы

Question

JQuery Mobile Panel - Связывание внутри страницы

0

Некоторое время я искал этот ответ, но мне не повезло.

В моей мобильной панели jQuery я пытаюсь перейти к разделу страницы:

<div data-role="page" id="home">
<!--- PANEL MENU --->
<div data-role="panel" id="firstpanel">
<a href="#test">test</a></li>
</div>

<!--- CONTENT -->
<div class="content" data-role="content">
<a name="test"></a>
</div>

Это не работает внутри кода панели. Любые идеи, почему это может не сработать? Я попытался использовать абсолютную ссылку (http://www.google.com), и она отлично работала. У меня просто возникают проблемы с привязкой к разделу на странице.

Спасибо за вашу помощь.

kdipaolo 21 фев. 2014, в 00:10

Источник

0

Я обновил свой оригинальный ответ с лучшим решением.
ezanker 21 фев. 2014, в 02:27

Теги:

jquery

jquery-mobile

1 ответ

Ещё вопросы

Я обновил свой оригинальный ответ с лучшим решением.

ezanker · Answer 1 · 2014-02-20T21-25-00.000Z

В мобильном устройстве jQuery вы можете использовать метод $.mobile.silentScroll() (https://api.jquerymobile.com/jQuery.mobile.silentScroll/) для перехода к элементу на странице. Поэтому для вашего примера вы можете обработать событие щелчка ссылки в панели, прочитать ссылку href ссылки, чтобы получить идентификатор элемента назначения. получить верхнее смещение этого элемента и, наконец, прокрутить до элемента:

<div data-role="panel" id="firstpanel">
    <ul id="navigation" data-role="listview" data-inset="true">
        <li><a href="#test" class="scrollTo">Show #test</a></li>
    </ul>
</div>

$(document).on("pagecreate", "#page1", function(){
    $(".scrollTo").on("click", function(){
        var elem = $(this).prop("href");
        elem = elem.substr(elem.lastIndexOf("#"));
        //scroll to elem
        var top = $(elem).offset().top;
        $.mobile.silentScroll( top );
        return false;
    });
});

Вот ДЕМО

ПРИМЕЧАНИЕ. В демонстрации ссылка прокручивает вас до имени Tristan.