我需要为crossslide幻灯片实现分页 谁能告诉我如何在 crossslide slideshow 中实现分页?
提前致谢....
最佳答案
我想以下可能是适合您的解决方案,尽管它并不完美。
例如,您的配置为:
$test3.crossSlide({
fade: 1
}, [
{ // #1
src: 'sand-castle.jpg',
alt: 'Sand Castle',
from: '100% 80% 1x',
to: '100% 0% 1.7x',
time: 3
},
{ // #2
src: 'flip-flops.jpg',
alt: 'Flip Flops',
from: '100% 80% 1.5x',
to: '80% 0% 1.1x',
time: 2
}
]
);
如果用户想看到第二张图片,你可以重新排序配置,然后 再次调用 crossSlide()。第二张图片将立即显示。
$test3.crossSlide({
fade: 1
}, [
{ // #2
src: 'flip-flops.jpg',
alt: 'Flip Flops',
from: '100% 80% 1.5x',
to: '80% 0% 1.1x',
time: 2
}, {
//#1
src: 'sand-castle.jpg',
alt: 'Sand Castle',
from: '100% 80% 1x',
to: '100% 0% 1.7x',
time: 3
}
]
);
例如,分页代码可以是这样的:
<a class='change_img' data-img='1' style='cursor: pointer'>#1</a>
<a class='change_img' data-img='2' style='cursor: pointer'>#2</a>
...
<a class='change_img' data-img='5' style='cursor: pointer'>#5</a>
$('.change_img').live('click', function(){
var images = [/* your configuration */];
var idx = parseInt($(this).attr('data-img'));
var tmp = images.splice(0, idx-1);
images = images.concat(tmp);
$('#your_placeholder').crossSlide({fade:1}, images);
});
关于html - Crossslide 的分页?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6758010/