我和我的老板一起工作并试图制作一张他很容易更新的幻灯片。 XML似乎是完美的实现。我所做的是创建一个XML文件,将jQuery解析为#slider div。然后Nivo将拾取这些图像并显示它们。然而,似乎NivoSlider在实际解析之前加载,因此Nivo没有检测到这些图像(即使使用Firebug,你可以告诉它们在那里)。有没有办法延迟加载NivoSlider,直到这个信息被解析?在我开始修复此错误之前,有50%的时间Nivo会检测到图像,然后另一半则不会...你可以看到这里发生了什么:http://snowtailcreative.com/domains/portfolio/xml/
XML:
<news>
<entry>
<slider>true</slider>
<title>Computer Science Wins Again</title>
<department>Computer Sience</department>
<image>images/up.jpg</image>
<link>http://www.google.com</link>
</entry>
</news>
JavaScript的:
// XML Parser
function parseXML() {
// Get XML File
$.get('example.xml', function(xml){
// Loop Through Each Entry in XML
$(xml).find('entry').each(function(){
// Declare Variables
var entry = $(this);
var type = entry.find('slider').text();
var title = entry.find('title').text();
var department = entry.find('department').text();
var image = entry.find('image').text();
var link = entry.find('link').text();
// Sort Through Item Types
if(type == 'true'){
var slider = '<a href="' + link + '"><img src="' + image + '" title="' + title + '" alt="' + department + '" /></a>';
}
if(type == 'false'){
var archive = '<h2>' + department + '</h2><p>' + title + '</p><a href="' + link + '">Read More</a>';
}
// Append Data
$("#archive").append(archive);
$("#slider").prepend(slider);
});
});
}
$.when( parseXML() ).done(function(){
$('#slider').nivoSlider();
});