0

我正在使用标头中的当前代码使 PrettyPhoto 对 W3C 有效。

 jQuery(document).ready(function() {
     jQuery("a[data-gal^='prettyPhoto']").prettyPhoto({
     social_tools:false 
     });
 });

未经修改的代码并由 prettyPhoto 文档推荐

<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
    $("a[rel^='prettyPhoto']").prettyPhoto();
});
</script>

使用页面代码如下。

<li><a href="http://cdn.domain.com/1.jpg" data-gal="prettyPhoto[pp_gal]"><img class="lazy" src="http://cdn.domain.com/grey.gif" data-original="http://cdn.domain.com/1.jpg" alt=""></a></li>
<li><a href="http://cdn.domain.com/2.jpg" data-gal="prettyPhoto[pp_gal]"><img class="lazy" src="http://cdn.domain.com/grey.gif" data-original="http://cdn.domain.com/2.jpg" alt=""></a></li>

PS。它在拇指上使用 LazyLoad，但也可以正常工作。

这些图像在prettyPhoto的灯箱中工作，但它们没有在画廊中打开（没有下一个，上一个等，我认为它没有检测到使用相同标签的其他图像），我怀疑它与 [pp_gal] 和我编写的代码是为了让它在 data-gal 而不是 rel= 上工作。

我怀疑这对于 jQuery 大师来说是一个简单的解决方法。谢谢

4

2 回答 2

1

由于您的数据属性的值是prettyPhoto[pp_gal]而不是简单prettyPhoto的，我们可以推断该prettyPhoto插件在那里查找所需的信息以执行您想要的操作。

您需要进入源代码prettyPhoto并使其查看data-gal而不是rel.

于 2012-12-20T11:49:30.873 回答
0

经过调查，prettyPhoto 最近似乎改进了他们的代码，并且采用这种更改是直截了当的，因为他们现在 Hook 'REL' 属性并更改一个值可以解决所有问题。呜呜呜！

Believe 是一个如何使 prettyPhoto W3C 有效的示例。在线 8 你有这个

(function($){$.prettyPhoto={version:'3.1.4'};$.fn.prettyPhoto=function(pp_settings){pp_settings=jQuery.extend({hook:'data-gal',animation_speed:'fast',ajaxcallback:function(){},slideshow:5000,autoplay_slideshow:false,opacity:0.80,show_title:true,allow_resize:true,allow_expand:true,default_width:500,default_height:344,counter_separator_label:'/',theme:'pp_default',horizontal_padding:20,hideflash:false,wmode:'opaque',autoplay:true,modal:false,deeplinking:true,overlay_gallery:true,overlay_gallery_max:30,keyboard_shortcuts:true,changepicturecallback:function(){},callback:function(){},ie6_fallback:true,markup:'<div class="pp_pic_holder">

寻找这个

jQuery.extend({hook:'rel'

并更改为

jQuery.extend({hook:'data-gal'

或者，您可以下载我编辑的版本，它是最新版本，可以在此处找到jquery.prettyPhoto-3.1.4-W3C.js

于 2012-12-20T16:20:11.453 回答