类似于 Google Play 商店的 jQuery 移动导航选项卡

Navigation tabs with jQuery mobile similar to Google Play store(类似于 Google Play 商店的 jQuery 移动导航选项卡)

问题描述

我如何使用 jQuery mobile 实现这种类型的导航选项卡，类似于 Google Play 商店?

How can I do this type of navigation tabs with jQuery mobile, similar to the Google Play store?

推荐答案

你可以使用 swipe 事件和 jquery 在你的部分 html 之间动态切换，使用切换，或者使用 $.mobile.changePage(url)，例子

You can use swipe events and with jquery dynamically switch between parts of you html using toggle, or using $.mobile.changePage(url), example

$('div[data-role=page]').on('swipeleft, swiperight ', go);

function go(event) {
    switch(event.type) {
        case 'swiperight':
            console.log('swiperight');
            $('#divid2,#divid3').toggle(false);
            $('#divid1').toggle(true);
            break;
        case 'swipeleft':
            console.log('swipeleft');
            $('#divid1,#divid2').toggle(false);
            $('#divid3').toggle(true);
            break;
    }
}

类似的东西，或者您可以使用 jquery animate 来淡出 html 的部分，或者使用 $.mobile.changePage(url) 可以在不同页面之间转换，如果您有相同的页眉和页脚，它将看起来像标签.

Something like that or you can use jquery animate to fadeOut parts of the html, or use $.mobile.changePage(url) which can transition between different pages and it will look like tabs if you have same headers and footers.

这篇关于类似于 Google Play 商店的 jQuery 移动导航选项卡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！