0

我有一个问题。

我正在使用 jQuery 为图像分配最大高度。通过获取徽标图像旁边的幻灯片的高度来生成最大高度值。请查看该网站:http ://debourg-dev.ch/lestroisverres/

受影响的代码是:

var sliderHeight = $('.flexslider').height();
$('#logo img').css({'max-height': sliderHeight});

$(window).resize(function() {

    var sliderHeight = $('.flexslider').height();
    $('#logo img').css({'max-height': sliderHeight});

});

一旦您开始调整窗口大小,徽标就会出现并且可以正常缩放,因此问题看起来像是在确定幻灯片高度之前正在加载脚本。我尝试将受影响的代码包装在 $(window).load 函数中,但这没有任何区别。

有什么帮助吗?

谢谢

4

2 回答 2

0

尝试这个:

$('.flexslider').flexslider({
    animation: "slide",
    controlsContainer: ".flex-container",
    controlNav: false,
    slideshowSpeed: 6000,
    animationDuration: 1600,
    start: function(slider) {
        var sliderHeight = this.height();
        $('#logo img').css({'max-height': sliderHeight});
    }
});

start选项在滑块显示其第一张图像时运行该功能,因此此时应加载图像,并且高度将是已知的。

于 2013-05-23T16:56:40.470 回答
-1

您应该使用height而不是max-height,因为max-height仅确定最大高度。在这种情况下,它将始终是图像大小,并且您只能按比例缩小它。

//编辑所以Barmar描述了高度0的问题,在你为标志设置高度的时候,javascript还不知道高度是多少,因为它还没有加载图像。

如文档所示,您有几个回调:

start: function(){},            //Callback: function(slider) - Fires when the slider loads the first slide
added: function(){},            //{NEW} Callback: function(slider) - Fires after a slide is added

因此,您需要在文档加载回调中将初始高度设置添加到其中之一中。

于 2013-05-23T16:48:54.633 回答