我是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>
#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%;
}
<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>
最佳答案
就给吧
#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>