删除jquery-mobile中的垂直滚动条

时间:2015-11-30 10:10:00

标签: jquery html css jquery-mobile

我是jquery-mobile的新手。加载div" display:none; "时,页面正常。但在加载div" display:block; "后,会出现一个垂直滚动条。

我尝试将css高度更改为80%,正在工作。但我想要的是100%。

如何删除垂直滚动条。感谢

以下是我的jsfiddle:



<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
&#13;
#uploadloading {
    position: absolute;
    z-index: 1;
    background: url(http://www.arabianbusiness.com/skins/ab.main/gfx/loading_spinner.gif) 50% 50% no-repeat rgba(255, 255, 255, 0.8);
    width: 100%;
    height: 100%;
}
&#13;
<div data-role="page" id="samplepg">
<div data-role="header" data-position="fixed" data-theme="a" role="banner" class="ui-header ui-bar-a ui-header-fixed slidedown ui-fixed-hidden"><h1 class="strokeme ui-title" role="heading" aria-level="1">Header</h1>
</div>

<div data-role="main" class="ui-content" id="samplemain"><div id="uploadloading" style="display:block;"></div>
<div id="samplebody">
    <li>sdf</li>
     <li>sdf</li>
     <li>sdf</li>
     <li>sdf</li>
     <li>sdf</li>
     <li>sdf</li>
     <li>sdf</li>
     <li>sdf</li>
     <li>sdf</li>
     <li>sdf</li>
     <li>sdf</li>
     <li>sdf</li>
</div>
<div data-role="footer" data-id="foo1" style="text-align:center;" data-position="fixed" data-tap-toggle="false"><div class="bfooter"><div style="height:56px;">Footer</div>
</div>
</div>
</div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:1)

请提供

 #uploadloading {
     top: 0;
  }

#uploadloading {
  position: absolute;
  z-index: 1;
  background: url(http://www.arabianbusiness.com/skins/ab.main/gfx/loading_spinner.gif) 50% 50% no-repeat rgba(255, 255, 255, 0.8);
  width: 100%;
  height: 100%;
  top: 0;
}
<div data-role="page" id="samplepg">
  <div data-role="header" data-position="fixed" data-theme="a" role="banner" class="ui-header ui-bar-a ui-header-fixed slidedown ui-fixed-hidden">
    <h1 class="strokeme ui-title" role="heading" aria-level="1">Header</h1>
  </div>

  <div data-role="main" class="ui-content" id="samplemain">
    <div id="uploadloading" style="display:block;"></div>
    <div id="samplebody">
      <li>sdf</li>
      <li>sdf</li>
      <li>sdf</li>
      <li>sdf</li>
      <li>sdf</li>
      <li>sdf</li>
      <li>sdf</li>
      <li>sdf</li>
      <li>sdf</li>
      <li>sdf</li>
      <li>sdf</li>
      <li>sdf</li>
    </div>
    <div data-role="footer" data-id="foo1" style="text-align:center;" data-position="fixed" data-tap-toggle="false">
      <div class="bfooter">
        <div style="height:56px;">Footer</div>
      </div>
    </div>
  </div>