问题描述
我在Flash中创建了一个幻灯片,我想在jQuery中进行模仿。幻灯片放映使用幻灯片中的图像作为寻呼机号码。我曾经遇到的问题是我曾经将链接应用到幻灯片图片中,pagerAnchorBuilder图片为图片的src返回一个未定义的图片。
Javascript -
$(function(){
$('#slideshow')。before('< ul id =nav>') .cycle({
fx:'fade',
timeout:7000,
pager:'#nav',
pagerAnchorBuilder:function(idx,slide){
< / a>< a href =#>< img src ='+ slide.src +'width =100height =60/>< / a>< / li>';
}
});
});
HTML -
< div id =slideshowclass =pics>
< a href =http://google.com>< img src =home_1.jpgwidth =1000height =600/>< / a>
< a href =http://google.com>< img src =home_2.jpgwidth =1000height =600/>< / a>
< a href =http://google.com>< img src =home_3.jpgwidth =1000height =600/>< / a>
< a href =http://google.com>< img src =home_4.jpgwidth =1000height =600/>< / a>
< a href =http://google.com>< img src =home_5.jpgwidth =1000height =600/>< / a>
< / div>
如果我从幻灯片中删除了href,则寻呼机中的图像显示没有问题。我不知道这是一个错误还是我需要找到一个修复程序?
这是答案 -
($< ul id =nav>')。cycle({$($ {pre
fx:'fade',
timeout:7000,
pager:'#nav',
pagerAnchorBuilder:function(idx,slide){
var img = $( (0).attr(src);
return'< li>< a href =#>< img src ='+ img +' width =100height =60/>< / a>< / li>';
}
});
$ c
$ b
});
阅读这可能会帮助你!
I have a slideshow built in flash that I want to mimic in jQuery. The slide show uses the images from the slideshow as the pager numbers. The problem im having is once i apply links to the slideshow images the pagerAnchorBuilder image returns an undefined for the src of the image.
Javascript -
$(function() {
$('#slideshow').before('<ul id="nav">').cycle({
fx: 'fade',
timeout: 7000,
pager: '#nav',
pagerAnchorBuilder: function(idx, slide) {
return '<li><a href="#"><img src="' + slide.src + '" width="100" height="60" /></a></li>';
}
});
});
HTML -
<div id="slideshow" class="pics">
<a href="http://google.com"><img src="home_1.jpg" width="1000" height="600" /></a>
<a href="http://google.com"><img src="home_2.jpg" width="1000" height="600" /></a>
<a href="http://google.com"><img src="home_3.jpg" width="1000" height="600" /></a>
<a href="http://google.com"><img src="home_4.jpg" width="1000" height="600" /></a>
<a href="http://google.com"><img src="home_5.jpg" width="1000" height="600" /></a>
</div>
If i remove the href's from the slideshow the images in the pager show up without issues. Im not sure if this is a bug or something i need to find a fix for?
Here is the answer -
$(function() {
$('#slideshow').before('<ul id="nav">').cycle({
fx: 'fade',
timeout: 7000,
pager: '#nav',
pagerAnchorBuilder: function(idx, slide) {
var img = $(slide).children().eq(0).attr("src");
return '<li><a href="#"><img src="' + img + '" width="100" height="60" /></a></li>';
}
});
});
Read this may help you!
这篇关于jQuery Cycle插件pagerAnchorBuilder图片变得未定义的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!