jquery 移动外部面板不采用样式

问题描述

我正在尝试实现 jQuery mobile 1.4 rc1 中提供的新外部面板.我能够让面板按它应该的方式进入和关闭所有页面，但是面板不会继承默认主题 (c) 的样式，如果使用 data-theme=a 定义主题也不会.该面板将加载一个无样式的列表视图，除非我导航到 url 中的 #app-menu 然后样式出现.有谁知道为什么会这样?

I am trying to implement the new external panel offered in jQuery mobile 1.4 rc1. I am able to get the panel to enter and dismiss across all pages as it should, however the panel does not inherit the styles from the default theme (c) nor will it if a theme is defined using data-theme=a. The panel will load an unstyled list view unless I navigate the to #app-menu in the url then the styles appear. Does anyone know why this might be?

<script id="panel-init">
        $(function () {
            $("body > [data-role='panel']").panel();

        });
    </script>

<div data-role="panel" id="app-menu" data-display="push" data-position="left">
        <ul data-role="listview">
            <li data-role="list-divider">Menu</li>
            <li data-icon="home" data-bind="click: navTo.bind($data, 'location-map', 'flip', false)">current party</li>

        </ul>
    </div>

推荐答案

jQuery Mobile now offer external panel and toolbar. Those widgets aren't being initiated automatically by jQM. They need to be initiated manually and followed by .enhanceWithin() to enhace contents within.

jQuery Mobile 现在提供外部面板和工具栏.jQM 不会自动启动这些小部件.它们需要手动启动，然后是 .enhanceWithin() 以增强其中的内容.

$(function () { $("[data-role=panel]").panel().enhanceWithin();});

演示

这篇关于jquery 移动外部面板不采用样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！