1

我正在尝试在标题栏中提供“选项”下拉菜单。我已成功将其添加到标题中。但问题是，它在“展开”状态下伸展，在塌陷状态下恢复正常。

这是解决问题的方法：http: //jsfiddle.net/vNTR5/

我尝试了几件事：

  1. 我注意到“ui-collapsible-heading ui-collapsible-heading-collapsed”类处于折叠状态，而“ui-collapsible-heading”类处于展开状态。我捕获了这些事件并尝试添加“ui-collapsible-heading-collapse”类。这导致列表一旦扩展就永久“扩展”。
  2. 我尝试制作自定义 css 类，并添加和删除它们。但它根本不会margin-left通过课程添加。它在它内联时需要它。

请帮忙。

代码片段：

HTML：

<div data-role="header"> 

                  <h1>Main Menu</h1>

                  <div data-role="collapsible" id="optionsMenu" data-mini="true" class="rightMenu" data-collapsed-icon="gear" data-expanded-icon="gear">
                    <h3 style="margin-left:-20%;">Options</h3>
                      <ul data-role="listview">
                        <li data-icon="false"><a href="#">Settings</a></li>
                        <li data-icon="false"><a href="#">Logout</a></li>                        
                      </ul>
                  </div>

             </div>

CSS：

.rightMenu{
    position: absolute;
    top:-10%;   
    right:2%;
}
4

1 回答 1

1

工作示例：http: //jsfiddle.net/Gajotres/FSSzK/

.rightMenu {
    position: absolute;
    top:-10%;   
    right:2%;
    width: 100px !important;
}

.rightMenu .ui-collapsible-content .ui-listview {
    margin: -10px -15px -10px -35px !important;
}
于 2013-05-21T13:06:22.507 回答