十一
十一
  • 发布:2014-09-25 11:08
  • 更新:2014-09-26 18:30
  • 阅读:8470

使用segmented-control选项卡,来回切换的时候每个选项内容会跳到最上面。(内容高度要高到出现滚动条)

分类:MUI
mui

使用segmented-control选项卡,来回切换的时候每个选项内容会跳到最上面。(内容高度要高到出现滚动条)

2014-09-25 11:08 负责人:无 分享
已邀请:
DCloud_UNI_FXY

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

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

该问题目前已经被锁定, 无法添加新回复