我正在使用ZURB Foundation 的 Orbit 图像滑块并尝试调用与afterSlideChange
. 这是代码片段:
$(window).load(function() {
$("#view-show").orbit({
animation: 'horizontal-push', // fade, horizontal-slide, vertical-slide, horizontal-push
animationSpeed: 1200, // how fast animtions are
timer: false, // true or false to have the timer
resetTimerOnClick: false, // true resets the timer instead of pausing slideshow progress
advanceSpeed: 4000, // if timer is enabled, time between transitions
pauseOnHover: false, // if you hover pauses the slider
shouldtartClockOnMouseOut: false, // if clock should start on MouseOut
startClockOnMouseOutAfter: 1000, // how long after MouseOut should the timer start again
directionalNav: true, // manual advancing directional navs
captions: true, // do you want captions?
captionAnimation: 'fade', // fade, slideOpen, none
captionAnimationSpeed: 1200, // if so how quickly should they animate in
bullets: false, // true or false to activate the bullet navigation
bulletThumbs: false, // thumbnails for the bullets
bulletThumbLocation: '', // location from this file where thumbs will be
afterSlideChange: function(){
var maxWidth = 400; // Max width for the image
var maxHeight = 300; // Max height for the image
var ratio = 0; // Used for aspect ratio
var cur = this.$slides[this.activeSlide];
console.log(cur);
var width = cur.width(); // Current image width
var height = cur.height(); // Current image height
// Check if the current width is larger than the max
if(width > height){
height = ( height / width ) * maxHeight;
} else if(height > width){
maxWidth = (width/height)* maxWidth;
}
cur.css("width", maxWidth); // Set new width
cur.css("height", maxHeight); // Scale height based on ratio
}, // empty function
fluid: true // or set a aspect ratio for content slides (ex: '4x3')
})
});
我收到以下错误:
Uncaught TypeError: Property 'width' of object #<HTMLImageElement> is not a function
你知道我做错了什么吗?