我正在使用Sponsor Flip Wall在我的网页上显示引用。 每个参考文献都应该用Pretty Photo lightbox预览少量图片。 在第一个翻转侧有一个参考图片，在它翻转之后，我有参考描述，下面是画廊的链接...
<?php
// Each sponsor is an element of the $sponsors array:
$reference = array(
array('hram_hrista_spasitelja','Najzahtjevnija građevina u regiji u posljednje vrijeme. 23 000 elemenata kompletno napravljenih u našim pogonima, nekoliko rozeta izrađenih water-jetom, brojni stubovi i reljefi, ograde, mozaici te kompletni podovi izrađeni u mozaiku rezanom water-jetom, te brojni ostali zahtjevni elementi urađeni suvremenim CNC strojevima i završno urađeni umjetničkom rukom klesara.','../slike/reference/slike/hram_hrista_spasitelja/01.jpg','Hram Hrista Spasitelja - Banja Luka')
);
// Randomizing the order of sponsors:
shuffle($reference);
?>
<div class="tekst">
<div class="referenceListHolder">
<?php
// Looping through the array:
foreach($reference as $referenca)
{
echo'
<div class="reference" title="Kliknite za okretanje">
<div class="referenceFlip">
<img src="../slike/reference/'.$referenca[0].'.png" alt="Više o: '.$referenca[0].'" />
</div>
<div class="referenceData">
<div class="referenceDescription">
'.$referenca[1].'
</div>
<div class="referenceURL">
<a href="'.$referenca[2].'" rel="reference" title="'.$referenca[3].'">Galerija slika</a>
</div>
</div>
</div>
';
}
?>
<div class="clear"></div>
</div>
</div>
<script type="text/javascript">
/* PRETTY PHOTO */
$("a[rel^='reference']").prettyPhoto({
animationSpeed: 'slow', /* fast/slow/normal */
slideshow: 4000, /* false OR interval time in ms */
padding: 40, /* padding for each side of the picture */
opacity: 0.35, /* Value betwee 0 and 1 */
overlay_gallery: false, /* If set to true, a gallery will overlay the fullscreen image on mouse over */
showTitle: true, /* true/false */
allowresize: false, /* true/false */
counter_separator_label: '/', /* The separator for the gallery counter 1 "of" 2 */
social_tools: false, /* html or false to disable */
deeplinking: false, /* Allow prettyPhoto to update the url to enable deeplinking. */
keyboard_shortcuts: true, /* Set to false if you open forms inside prettyPhoto */
theme: 'dark_rounded' /* pp_default / light_rounded / dark_rounded / light_square / dark_square / facebook */
});
/* KRAJ PRETTY PHOTO */
</script>
漂亮照片不会以这种方式被解雇，但图片正在加载到新标签中！ 如果我将画廊链接放在.referenceData div之外（例如在.sponsorFlip div里面），它可以正常工作...... 我猜与.sponsorFlip click（）事件和prettyPhoto click（）事件有一些冲突???
以下是翻转参考文献的代码......
//REFERENCE - FLIP PLUGIN
$('.referenceFlip').live("click",function(){
// $(this) point to the clicked .sponsorFlip element (caching it in elem for speed):
var elem = $(this);
// data('flipped') is a flag we set when we flip the element:
if(elem.data('flipped'))
{
// If the element has already been flipped, use the revertFlip method
// defined by the plug-in to revert to the default state automatically:
elem.revertFlip();
//Prilikom vraćanja (revert) reference - vraća height na 100% (kako je i bio)
$(this).css("height", "100%");
// Unsetting the flag:
elem.data('flipped',false)
}
else
{
// Using the flip method defined by the plugin:
elem.flip({
direction:'lr',
speed: 350,
dontChangeColor: true,
onBefore: function(){
// Insert the contents of the .sponsorData div (hidden from view with display:none)
// into the clicked .sponsorFlip div before the flipping animation starts:
elem.html(elem.siblings('.referenceData').html());
}
});
//Ako dođe do overflow-a, povećava height reference za 50 kako bi stao sav tekst
if($(this)[0].clientHeight < $(this)[0].scrollHeight)
$(this).css("height", $(this).children().height()+50);
// Setting the flag:
elem.data('flipped',true);
}
});
有谁知道问题出在哪里？
答案 0 :(得分：1)
我终于设法修复赞助商翻转墙与PrettyPhoto合作!!!
<div class="referenceURL"> <a href="'.$referenca[2].'" rel="reference" title="'.$referenca[3].'">Galerija slika</a> </div>
$（ “一个[相对^ = '参考']”）prettyPhoto（）;
!!!它现在应该工作！
<小时/> 以下是整个js代码从原始代码略微改变为我的需求：
//FLIP PLUGIN
$('.referenceFlip').live("click",function(){
// $(this) point to the clicked .sponsorFlip element (caching it in elem for speed):
var elem = $(this);
//Eliminates unnecessary PrettyPhoto gallery links
elem.siblings().find('.referenceURL a:not(:first)').html("");
//data('flipped') is a flag we set when we flip the element:
if(elem.data('flipped'))
{
// If the element has already been flipped, use the revertFlip method
// defined by the plug-in to revert to the default state automatically:
elem.revertFlip();
//After reverting the flip - sets the height back to 100% (as it was)
elem.css("height", "100%");
// Unsetting the flag:
elem.data('flipped',false)
}
else
{
// Using the flip method defined by the plugin:
elem.flip({
direction:'lr',
speed: 350,
dontChangeColor: true,
onBefore: function(){
// Insert the contents of the .sponsorData div (hidden from view with display:none)
// into the clicked .sponsorFlip div before the flipping animation starts:
elem.html(elem.siblings('.referenceData').html());
}
});
//If the div overflows, increase the div's height for +50 to fit the entire text
if(elem[0].clientHeight < elem[0].scrollHeight)
elem.css("height", elem.children().height()+50);
/* PRETTY PHOTO INITIATION */
$("a[rel^='reference']").prettyPhoto({
animationSpeed: 'slow', /* fast/slow/normal */
slideshow: 4000, /* false OR interval time in ms */
padding: 40, /* padding for each side of the picture */
opacity: 0.35, /* Value betwee 0 and 1 */
overlay_gallery: false, /* If set to true, a gallery will overlay the fullscreen image on mouse over */
showTitle: true, /* true/false */
allowresize: false, /* true/false */
counter_separator_label: '/', /* The separator for the gallery counter 1 "of" 2 */
social_tools: false, /* html or false to disable */
deeplinking: false, /* Allow prettyPhoto to update the url to enable deeplinking. */
keyboard_shortcuts: true, /* Set to false if you open forms inside prettyPhoto */
theme: 'dark_rounded', /* pp_default / light_rounded / dark_rounded / light_square / dark_square / facebook */
});
/* END OF PRETTY PHOTO INITIATION */
// Setting the flag:
elem.data('flipped',true);
}
});
答案 1 :(得分：1)
这有点帮助，同样的修复适用于灯箱，只需使用：
('a[@rel*=lightbox]').lightBox();
而不是
/* PRETTY PHOTO INITIATION */
$("a[rel^='reference']").prettyPhoto({
animationSpeed: 'slow', /* fast/slow/normal */
slideshow: 4000, /* false OR interval time in ms */
padding: 40, /* padding for each side of the picture */
opacity: 0.35, /* Value betwee 0 and 1 */
overlay_gallery: false, /* If set to true, a gallery will overlay the fullscreen image on mouse over */
showTitle: true, /* true/false */
allowresize: false, /* true/false */
counter_separator_label: '/', /* The separator for the gallery counter 1 "of" 2 */
social_tools: false, /* html or false to disable */
deeplinking: false, /* Allow prettyPhoto to update the url to enable deeplinking. */
keyboard_shortcuts: true, /* Set to false if you open forms inside prettyPhoto */
theme: 'dark_rounded', /* pp_default / light_rounded / dark_rounded / light_square / dark_square / facebook */
});
/* END OF PRETTY PHOTO INITIATION */
：d