我正在尝试使用Basic jQuery Slider和另一个jQuery和一些XML生成的列表,但我发现BJQS不想将样式应用于正在生成的li元素,所以他们不会被隐藏和消失。
进入文档头我有:
<link rel="stylesheet" href="/assets/css/bjqs.css">
<script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="/assets/js/bjqs-1.3.min.js" type="text/javascript">
无论如何,bjqs都需要所有这些,并且根据Firebug正在加载。
我的身体:
<script>
jQuery(document).ready(function(){
jQuery.ajax({
type: "GET",
url: "images-revision.xml",
dataType: "xml",
success: parseXml
});
});
function parseXml(xml) {
var path = jQuery(xml).find('path').text();
jQuery(xml).find("image").each(function() {
jQuery(".bjqs").append("<li><img src='" + path + jQuery(this).find("filename").text() + "'/></li>");
});
}
</script>
在将文件列入BJQS的原位之前,从XML文件中的图像列表中读取。
然后我有了幻灯片容器:
<div id="banner-fade">
<ul class='bjqs'>
</ul>
</div>
其次是我想用来控制幻灯片的参数:
<script>
jQuery(document).ready(function(jQuery) {
jQuery('#banner-fade').bjqs({
height : 198,
width : 956,
automatic : true, // automatic
showcontrols : false, // show next and prev controls
usecaptions : false, // show captions for images using the image title tag
responsive : false, // enable responsive capabilities
showmarkers : false, // Show individual slide markers
// animation values
animtype : 'fade', // accepts 'fade' or 'slide'
animduration : 750, // how fast the animation are
animspeed : 5000, // the delay between each slide
});
});
</script>
正确的样式应用于#banner-fade和ul.bjqs,但不应用于生成的li元素,这些元素是隐藏并显示为在图像之间旋转的部分。
我觉得这与在创建lis之前调用的BJQS内容有关,但我不会假装知道该怎么做。
任何帮助都将不胜感激。
答案 0 :(得分:0)
使用窗口加载http://api.jquery.com/load-event/而不是为bjqs参数修复此部分的文档做好准备工作了。
所以我更换了这个:
jQuery(document).ready(function(jQuery) {
jQuery('#banner-fade').bjqs({
有了这个:
jQuery(window).load(function() {
$('#banner-fade').bjqs({