AYWQHHD 2017-12-04 01:08 采纳率: 0%
浏览 2187

mui顶部选项卡问题。并没能达到效果,请大神指教

<!doctype html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" href="css/mui.min.css">
</head>

<body>

    <div class="mui-content">
        <div id="slider" class="mui-slider mui-fullscreen">
            <div id="sliderSegmentedControl" class="mui-scroll-wrapper mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
                <div class="mui-scroll">
                    <a class="mui-control-item mui-active" href="#item1mobile" data-wid="movie_home.html">推荐</a>
                    <a class="mui-control-item" href="#item2mobile" data-wid="TV_play.html">电视剧</a>
                    <a class="mui-control-item" href="#item3mobile" data-wid="top_movie.html">电影</a>
                    <a class="mui-control-item" href="#item4mobile" data-wid="top_variety.html">综艺</a>
                    <a class="mui-control-item" href="#item5mobile" data-wid="top_entertainment.html">娱乐</a>
                </div>
            </div>
        </div>
    </div>

    <script src="js/mui.min.js"></script>
    <script src="js/webviewGroup.js" type="text/javascript" charset="utf-8"></script>

    <script>
        mui.init();

        mui.plusReady(function() {
            var group = new webviewGroup("top_tab.html", {
                items: [{
                    id: "movie_home.html", //这是子页1的路径
                    url: "movie_home.html",
                    extras: {}
                }, {
                    id: "TV_play.html", //这是子页2的路径
                    url: "TV_play.html",
                    extras: {}
                }, {
                    id: "top_movie.html", //这是子页2的路径
                    url: "top_movie.html",
                    extras: {}
                }, {
                    id: "top_variety.html", //这是子页2的路径
                    url: "top_variety.html",
                    extras: {}
                }, {
                    id: "top_entertainment.html", //这是子页2的路径
                    url: "top_entertainment.html",
                    extras: {}
                }],
                onChange: function(obj) {
                    var c = document.querySelector(".mui-control-item.mui-active");
                    if(c) {
                        c.classList.remove("mui-active");
                    }
                    document.querySelector(".mui-scroll .mui-control-item:nth-child(" + (parseInt(obj.index) + 1) + ")").classList.add("mui-active");
                }
            });
            mui(".mui-scroll").on("tap", ".mui-control-item", function(e) {
                var wid = this.getAttribute("data-wid");
                group.switchTab(wid);
            });

        });
        mui.back = function() {
            var _self = plus.webview.currentWebview();
            _self.close("auto");
        }
    </script>
</body>


图片说明

  • 写回答

1条回答

  • 关注

    是要个什么效果啊,没懂ε=(´ο`*)))唉

    评论

报告相同问题?

悬赏问题

  • ¥15 import arcpy出现importing _arcgisscripting 找不到相关程序
  • ¥15 onvif+openssl,vs2022编译openssl64
  • ¥15 iOS 自定义输入法-第三方输入法
  • ¥15 很想要一个很好的答案或提示
  • ¥15 扫描项目中发现AndroidOS.Agent、Android/SmsThief.LI!tr
  • ¥15 怀疑手机被监控,请问怎么解决和防止
  • ¥15 Qt下使用tcp获取数据的详细操作
  • ¥15 idea右下角设置编码是灰色的
  • ¥15 全志H618ROM新增分区
  • ¥15 在grasshopper里DrawViewportWires更改预览后,禁用电池仍然显示