想知道是否有人可以解释我与Jcarousel有关的特定问题。
我已经调整了“dynamic_ajax_php.php”示例,在数据库上使用wordpress查询成功地获取数据,然后我将所有这些都添加到xml格式中,然后我使用上面的示例来读取xml并显示在jcarousel。
一切都很好,但是在设置循环和自动选项时会有一个琐碎的问题。
基本上,如果没有足够的项目来填充jcarousel的宽度,那么它会显示余数的空白项目,直到下一次自动迭代(基本上问题出在初始加载时)
不幸的是,我必须让这个jcarousel变宽,所以我无法锁定宽度。
任何人对如何在初始加载时正确制作jcarousel包装有任何想法?
function mycarousel_itemLoadCallback(carousel, state)
{
// Check if the requested items already exist
if (carousel.has(carousel.first, carousel.last)) {
return;
}
jQuery.get(
'mediabox/write.xml',
{
first: carousel.first,
last: carousel.last
},
function(xml) {
mycarousel_itemAddCallback(carousel, carousel.first, carousel.last, xml);
},
'xml'
);
};
function mycarousel_itemAddCallback(carousel, first, last , xml)
{
// Set the size of the carousel
carousel.size(parseInt(jQuery('totalGalleryItems', xml).text()));
jQuery('imagePath', xml).each(function(i) {
carousel.add(first + i, mycarousel_getItemHTML(jQuery(this).text()));
});
};
/**
* Item html creation helper.
*/
function mycarousel_getItemHTML(url)
{
return '<img src="' + url + '" width="75" height="75" alt="" />';
};
jQuery(document).ready(function() {
jQuery('#mycarousel').jcarousel({
auto: 4,
wrap: 'circular',
// Uncomment the following option if you want items
// which are outside the visible range to be removed
// from the DOM.
// Useful for carousels with MANY items.
// itemVisibleOutCallback: {onAfterAnimation: function(carousel, item, i, state, evt) { carousel.remove(i); }},
itemLoadCallback: mycarousel_itemLoadCallback
});
});
作为测试,我将skin.css中两个css属性的宽度设置为;
.jcarousel-skin-ie7 .jcarousel-clip-horizontal {
width: 550px;
height: 77px;
}
.jcarousel-skin-ie7 .jcarousel-container-horizontal {
width: 550px;
padding: 20px 40px;
}
任何帮助都非常感谢!
感谢您寻找
答案 0 :(得分:0)
您可以尝试在调用轮播之前根据当前宽度放置一些占位符,并在加载轮播后删除它们