2

以下代码是 wordpress 幻灯片 jQuery 脚本的一部分。其目的是在幻灯片中实现特定逻辑，其中所有垂直图像都成对显示（如杂志的双页）。

function initSlideShow() {

//some stuff to append images in $hidden_ic (temp image container far far away - not hidden so the script can measure their dimensions)

//Step 3. Loop and transform
$hidden_ic.find('img').each(function(i, o){
var $img = $(this),
h = $img.height(), //current image height
w = $img.width(), //current image width
v = (h > w ? true : false), //current image vertical flag
nv = null, //next image vertical flag
$prev = $hidden_ic.find('img:eq(' + (i - 1) + ')'), //next image object
$next = $hidden_ic.find('img:eq(' + (i + 1) + ')'); //prev image object

if(typeof($img.attr('data-or')) === 'undefined' || $img.attr('data-or') === false)
{
//Save orientation
$img.attr('data-or', (v ? 1 : 0));

//Create new slide
var $slide = $('<div class="slide" />');

//Append a clone of current image
$slide.append($img.clone());

//If its not last
if($next.size()>0)
{
var nh = $next.height(), //next image height
nw = $next.width(), //next image height
nv = (nh>nw ? true : false); //next image vertical flag

if(v && nv) //if current and next one are both vertical
{
$next.attr('data-or', (nv ? 1 : 0)); //Save orientation
$next.addClass('right'); //Apply right floating

$slide.append($next.clone()); //Append a clone of the next image to the same slide
$slide.find('img').first().addClass('left');
}

if(v && !nv) //if current vertical and next one horizontal
{
$slide.find('img').first().addClass('left');
}

}

$main_ic.append($slide); //Append slide to main container
}
});

创建 's后，$slide我将它们传递给 jQuery Cycle 以创建幻灯片。

我的问题是我找不到寻呼机显示双页幻灯片的两个图像的方法（它只显示第一个 img）。这是我的循环代码：

$main_ic.cycle({
        fx:     'fade', 
        speed:   300, 
        timeout: 0, 
        next:   '.nextnav', 
        prev:   '.prevnav', 
        pause:   1,
        pager: '#pager',
        after: onAfter,
        pagerAnchorBuilder: function(idx, slide) { 
            return '<a href="#"><img src="' + jQuery(slide).find('img').first().attr('src') + '" height="100" /></a>';
                } 
}).fadeIn('slow');

我真的很感激任何帮助。谢谢你的时间。

4

0 回答 0