是点击切换选项卡。
<div class="mui-bar mui-bar-header-secondary">
<div id="rank_tab" class="mui-segmented-control tab-group">
<a class="mui-control-item mui-active" href="#lasted">
最新上架
</a>
<a class="mui-control-item" href="#history">
最近玩过
</a>
<a class="mui-control-item" href="#hot">
最热门
</a>
</div>
</div>
<nav class="mui-bar mui-bar-tab">...</nav>
<div id="personal" class="mui-popover mui-bar-popover mui-popover-bottom">...</div>
<div class="mui-content">
<div id="lasted" class="mui-control-content mui-active">
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell mui-media game-item">列表一</li>
<li class="mui-table-view-cell mui-media game-item">列表二</li>
</ul>
</div>
<div id="history" class="mui-control-content">
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell mui-media game-item">列表一</li>
<li class="mui-table-view-cell mui-media game-item">列表二</li>
</ul>
</div>
<div id="hot" class="mui-control-content">
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell mui-media game-item">列表一</li>
<li class="mui-table-view-cell mui-media game-item">列表二</li>
</ul>
</div>
</div>
3 个回复
DCloud_UNI_FXY
贴一下具体代码。
是点击切换选项卡?还是拖拽切换选项卡?
十一 (作者)
是点击切换选项卡。
<div class="mui-bar mui-bar-header-secondary">
<div id="rank_tab" class="mui-segmented-control tab-group">
<a class="mui-control-item mui-active" href="#lasted">
最新上架
</a>
<a class="mui-control-item" href="#history">
最近玩过
</a>
<a class="mui-control-item" href="#hot">
最热门
</a>
</div>
</div>
<nav class="mui-bar mui-bar-tab">...</nav>
<div id="personal" class="mui-popover mui-bar-popover mui-popover-bottom">...</div>
<div class="mui-content">
<div id="lasted" class="mui-control-content mui-active">
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell mui-media game-item">列表一</li>
<li class="mui-table-view-cell mui-media game-item">列表二</li>
</ul>
</div>
<div id="history" class="mui-control-content">
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell mui-media game-item">列表一</li>
<li class="mui-table-view-cell mui-media game-item">列表二</li>
</ul>
</div>
<div id="hot" class="mui-control-content">
<ul class="mui-table-view mui-table-view-chevron">
<li class="mui-table-view-cell mui-media game-item">列表一</li>
<li class="mui-table-view-cell mui-media game-item">列表二</li>
</ul>
</div>
</div>
DCloud_UNI_FXY
我用你的代码测试没问题。
最好贴出完整的代码
手机型号,系统版本也告知一下。
十一 (作者)
mui-control-content里的内容多增加几条,最好能让页面出现滚动条的~
2014-09-28 09:48
十一 (作者)
回复 十一:iphone5 IOS8.0.2
2014-09-28 10:11
DCloud_UNI_FXY
预计下次或下下次版本更新会修复此问题。
原因:你的选项卡使用了mui-bar-header-secondary样式,该样式是(fixed)固定定位
当点击选项卡按钮时,触发了href="#lasted".导致页面跳转到了锚点lasted.
后续的版本更新会阻止掉锚点跳转。目前你可以自己给选项卡按钮加onclick="return false;"
2014-09-28 14:29
十一 (作者)
没有使用mui-bar-header-secondary这个样式的,一般的选项卡也会触发#,官网上的例子也是一样,只是官网的tab内容不多,没有出现滚动条,用浏览器调试工具把内容增加到有滚动条,也是一样会跳一下,那先用onclick="return false;"这个办法了。谢谢~
2014-09-30 14:58
DCloud_UNI_FXY
0.5.8版本已经更新了。应该应经解决该问题了。不需要自己加return false了
2014-09-30 15:08