我正在使用带有jQuery Mobile的Photoswipe图库。单击时,第一个选择仅显示具有完整URL的图像,并且不适用于图库方式。当我返回并再次选择时,它工作正常。在第一次失败/刷新页面后,ps正在工作。
请查看下面的链接。这是我的移动网站。 http://w3qatar.info/aldarmobi
当我们检查链接属性>列表中的任何财产>查看更多照片...在此下您可以找到缩略图。当我们首先点击缩略图时,它将加载原始图像而没有图库视图。但是当我们返回并再次尝试时,它将工作。我使用opera移动模拟器进行测试。具有Mobile_jquery主题的Drupal 7。此站点使用Jquery mobile。
内部代码:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<link href="http://w3qatar.info/aldarmobi/sites/all/themes/mobile_jquery/photoswipe.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="http://w3qatar.info/aldarmobi/sites/all/themes/mobile_jquery/lib/klass.min.js"></script>
<script type="text/javascript" src="http://w3qatar.info/aldarmobi/sites/all/themes/mobile_jquery/scripts/code.photoswipe.jquery-3.0.5.min.js"></script>
<script type="text/javascript">
(function(window, PhotoSwipe){
document.addEventListener('DOMContentLoaded', function(){
var
options = {},
instance = PhotoSwipe.attach( window.document.querySelectorAll('#gallery li a'), options );
}, false);
}(window, window.Code.PhotoSwipe));
</script>
html部分:
<ul id="gallery" class="gallery">
<li><a href="imageurl1" rel="external"><img src="imageurl1" alt="image name1" /></a></li>
<li><a href="imageurl2" rel="external"><img src="imageurl2" alt="image name2" /></a></li>
<li><a href="imageurl3" rel="external"><img src="imageurl3" alt="image name3" /></a></li>
<li><a href="imageurl4" rel="external"><img src="imageurl4" alt="image name4" /></a></li>
</ul
你能帮帮我吗?
我想在iPhone设备和Android手机中使用它。
提前感谢。
harikris。
答案 0 :(得分:0)
我展示你使用jQuery的代码,所以为什么不用它做任何事情。
您可以更改下面的代码并查看其是否有效
(function(window, $, PhotoSwipe){
$(document).ready(function(){
$('div.p-img_more')
.live('pageshow', function(e){
var
currentPage = $(e.target),
options = {},
photoSwipeInstance = $("ul.gallery a", e.target).photoSwipe(options, currentPage.attr('id'));
return true;
})
.live('pagehide', function(e){
var
currentPage = $(e.target),
photoSwipeInstance = PhotoSwipe.getInstance(currentPage.attr('id'));
if (typeof photoSwipeInstance != "undefined" && photoSwipeInstance != null) {
PhotoSwipe.detatch(photoSwipeInstance);
}
return true;
});
});
}(window, window.jQuery, window.Code.PhotoSwipe));