×

竞彩足球负胜什么意思吉美在线平台登录

作者:天空2019.07.10来源:ca88亚洲城官网浏览:192评论:0
关键词:jsfixedfooter

ios下footer fixed定位,页面向下scroll时footer不实时渲染问题。

<div class="home">
      <div class="banner">
        <div
          class="search"
          @click="goToSearch"
        >
          <i />
        </div>
        <div class="name">
          <i />
          xxx
        </div>
      </div>
      <div class="tabs">
        <div
          v-for="(item,index) in tabs"
          :key="index"
          class="tab"
        >
          <i />
          {{ item }}
        </div>
      </div>
      <div
        class="recommend"
        ref="recommend"
      >
        <div class="title">
          xxxx
        </div>
        <div
          class="card"
          v-for="(item,index) in list"
          :key="index"
        >
          <div class="name">
            {{ item.name }}
          </div>
          <div class="info">
            <span>xx:<b>{{ item.xxx }}</b>个</span>
            <span>xx:<b>{{ item.xx }}</b>项</span>
            <span>xx:<b>{{ item.xx }}</b>项</span>
          </div>
          <div class="address">
            地址:{{ item.address }}
          </div>
          <div class="address">
            电话:{{ item.phone }}
          </div>
          <i />
        </div>
      </div>
    <Footer current="0" />
 </div>

因为ios下关闭了滚动实时触发属性,所以h5在ios下会有抖动问题。当滚动结束,footer才显现。

一直以为需要通过js才能解决,没想到改变下布局就完美解决啦~

footer与内容区不要在同一层级下布局,而是要高于页面内容区即可。

<div>
    <div class="home">
      <div class="banner">
        <div
          class="search"
          @click="goToSearch"
        >
          <i />
        </div>
        <div class="name">
          <i />
          xxx
        </div>
      </div>
      <div class="tabs">
        <div
          v-for="(item,index) in tabs"
          :key="index"
          class="tab"
        >
          <i />
          {{ item }}
        </div>
      </div>
      <div
        class="recommend"
        ref="recommend"
      >
        <div class="title">
          xxxx
        </div>
        <div
          class="card"
          v-for="(item,index) in list"
          :key="index"
        >
          <div class="name">
            {{ item.name }}
          </div>
          <div class="info">
            <span>xx:<b>{{ item.xxx }}</b>个</span>
            <span>xx:<b>{{ item.xx }}</b>项</span>
            <span>xx:<b>{{ item.xx }}</b>项</span>
          </div>
          <div class="address">
            地址:{{ item.address }}
          </div>
          <div class="address">
            电话:{{ item.phone }}
          </div>
          <i />
        </div>
      </div>
    </div>
    <Footer current="0" />
</div>

温馨提示:本文作者系 ,经ca88亚洲城官网编辑修改或补充,转载请注明出处和本文链接:
https://www.baruike.com/article/js72734827394.html

网友评论文明上网理性发言 已有0人参与

发表评论:

最新留言

  • 老部落运维

    都是拼音的错呵呵...

  • admin

    已加上,麻烦把我的文字改下:ca88亚洲城官网...

  • 老部落运维

    已添加贵站链接我站:https://www.laobuluo.com/(老部落运维)...

  • admin

    这个问题需要看不同的终端预览,可以加群具体聊,谢谢!...

  • 竹叶轻拂水

    在写PC端页面的时候,字体超过16px有的字体会显示的上下不一,凸出来一点,很难看,有没有什么好的方...

  • 素材火

    前三意料之中,中国只有百度上榜...

  • 开创者素材

    网站资源下载站,交换个友链如何?www.kaicz.com...

  • CSS66

    关于CSS组合选择符总结得全面,学习了!...

首页|JavaScript|HTML|HTML4|HTML5|CSS3|开发工具|性能优化|移动开发|亚洲城在线娱乐官网|性能优化|开发工具|酷站欣赏|UI设计|亚洲城在线娱乐官网

Copyright © 2019 ca88亚洲城官网(www.baruike.com) 版权所有 All Rights Reserved.
粤ICP备12067512号-1

Copyright Your WebSite.Some Rights Reserved.

Powered By Z-BlogPHP 1.5.2 Zero