小编use*_*984的帖子

所以有问题的网站:http://kaye.at/baby

下面的主要内容向上滚动倒计时的顶部和导航下的固定元素.这在桌面上工作正常,但在移动游戏中,当用户向上移动时内容滚动倒计时,但一旦触摸释放,它就会弹出.

只是想知道这是一个错误还是可以修复的东西？

这是CSS:

#header { position: fixed; width: 100%; top: 0px; z-index: 10; }
#content { width: 100%; position: relative; top: 650px; z-index: 7; }
#banner { position: fixed; width: 100%; position: fixed; background: url('http://kaye.at/baby/img/stork.jpg') no-repeat center bottom #fff;  padding-top: 185px; z-index: 1; }
#defaultCountdown { max-width: 70%; height: auto; }

和HTML(主要结构):

<div id="header">
    <div id="nav">
        <ul>
            <li><a class="active" href="index.php">START</a></li>
            <li><a href="ultrasound-images.php">ULTRASOUND PICS</a></li>
            <li><a href="pinkorblue.php">PINK OR BLUE?</a></li>
        </ul>
    </div>
</div>

<div id="banner">
   <div id="defaultCountdown"></div>
</div>

<div …

我有一个只有 1 页且有多个部分的网站，每个部分都包含一个内容 DIV 和一个 flexslider。在较大的屏幕上，似乎存在一个奇怪的错误，导致背景随幻灯片动画闪烁，具体操作如下： http: //yyy.comuf.com/PORT/

我认为这是因为页面上有多个 Flexslider，但不确定修复它的最佳方法。

JS

  $(window).load(function() {
$('#main-slider').flexslider({
  animation: 'slide',
  controlsContainer: '.flex-container'
});

$('#secondary-slider').flexslider();

});

HTML 滑块-1

<div id="main-slider" class="flexslider">
  <ul class="slides">
    <li>
      <img src="img/FP1.png" />
    </li>
    <li>
      <img src="img/abcd.png" />
    </li>
    <li>
      <img src="img/i-eg.png" />
    </li>
  </ul>
</div>

HTML 滑块-2

<div id="secondary-slider" class="flexslider">
  <ul class="slides">
    <li>
      <img src="img/OU.png" />
    </li>
    <li>
      <img src="img/OU1.png" />
    </li>
    <li>
      <img src="img/OU2.png" />
    </li>
  </ul>
</div>

目前，两个滑块除了图像不同之外都是相同的。

主要JS文件在这里：http ://yyy.comuf.com/PORT/js/jquery.flexslider.js

所以，我在这个页面上有几个不同的进度条 - http://kaye.at/play/goals

这是我的 HTML 和 CSS：

<div class="meter"><span style="width: 100%;"></span></div>


.meter { 
height: 5px;
position: relative;
background: #f3efe6;
z-index: 0;
margin-top: -5px;
overflow: hidden;
}

.meter > span {
z-index: 50;
display: block;
height: 100%;
background-color: #e4c465;
position: relative;
overflow: hidden;
}

我想简单地为进度条设置动画，使其从 0% 缓慢上升到它所处的任何百分比，而不是仅仅出现在那里，但我想以最简单的方式进行。我最好的选择是什么，我正在使用的当前代码是否可能？