use*_*273 5 javascript jquery html5 jquery-mobile
我的项目中有一个画廊滑块.
我在我的电脑上测试过,一切正常,
但是当我在我的ipad上测试时,当我打开我的项目时,画廊滑块的图像不会加载.
滑块中的总图像为62,总共为1.2mb
我的代码:
<div class="main">
<div class="fixed-bar" style="margin-top:40px">
<ul id="carousel" class="elastislide-list">
<li><a href="#p1"><img src="imagens/paginas/1.jpg" /></a>
</li>
<li><a href="#p2"><img src="imagens/paginas/2.jpg" /></a>
</li>
<li><a href="#p3"><img src="imagens/paginas/3.jpg" /></a>
</li>
<li><a href="#p4"><img src="imagens/paginas/4.jpg" /></a>
</li>
</ul>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
使用Javascript:
$(document).on('pagebeforeshow', function () {
$('.fixed-bar').hide();
});
$('#carousel').elastislide({
minItems: 9
});
Run Code Online (Sandbox Code Playgroud)
预载:
var images = new Array()
function preload() {
for (i = 0; i < preload.arguments.length; i++) {
images[i] = new Image()
images[i].src = preload.arguments[i]
}
}
preload(
"imagens/Paginas/1.jpg",
"imagens/Paginas/2.jpg",
"imagens/Paginas/3.jpg",
"imagens/Paginas/4.jpg",
"imagens/Paginas/5.jpg",
"imagens/Paginas/6.jpg",
"imagens/Paginas/7.jpg",
"imagens/Paginas/8.jpg",
"imagens/Paginas/9.jpg",
"imagens/Paginas/10.jpg",
"imagens/Paginas/11.jpg",
"imagens/Paginas/12.jpg",
"imagens/Paginas/13.jpg",
"imagens/Paginas/14.jpg",
"imagens/Paginas/15.jpg"
)
Run Code Online (Sandbox Code Playgroud)
我解决了我的问题.
我做了什么:
之前:
我之前有一个带有几个data-role ="pages"的html文档,第一个data-role ="page"是我的菜单,用户可以在其中选择选项.当用户点击其中一个选项时,我的代码是<a href="#p2"></a>,转到另一个页面的常态,(注意:这个选项中只有一个必须在另一个页面的库中加载图像)
之后: 现在,我将这份文件分成两部分.一个文档html仅用于起始页面(菜单),另外几个data-role ="pages"在另一个文档中.
我是怎么做的电话:
我使用带有新功能的弹出窗口,并在使用后选择其中一个我使用此代码:
<a href="../thisdocument.html" target="_parent"></a>
Run Code Online (Sandbox Code Playgroud)
魔术就完成了.没有额外的代码等....只加载包含来自另一个子文件夹的库滑块的文档html.
| 归档时间: |
|
| 查看次数: |
564 次 |
| 最近记录: |