2

我有一些 jquery 代码用于根据其宽度设置 div 高度。JSFiddle 示例在这里。

一切都按原样工作，但我想要的是一个可重用的函数，这样我就不会为每个唯一的 id 创建完全相同的函数。该代码目前仅适用于#bigHug div，但我希望能够$('#biggerHug').setHeight(1.8)在.readyand.resize函数中执行类似操作并为提供的 id 设置高度。

我试图通过放置$(this).width()而不是函数来尝试解决方案，但一切都“坏了” $('#bigHug').width()。setHeightdiv 不会在加载或调整窗口大小时显示。我在想它与$(this)引用$(window).ready而不是$('#bigHug').setHeight(1.8).

想法？

4

2 回答 2

3

试试这个：

function setHeight(ratio, elem ) {
    $elem = $(elem);
    var divWidth = $elem.width();
    var divHeight = divWidth / ratio;
    $elem.height(divHeight);
}


$(window).ready(function() {
    setHeight(1.8, '#bigHug');
});

$(window).resize(function() {
    setHeight(1.8, '#bigHug');
});​

演示

于 2012-12-11T20:34:23.443 回答
2

你可以像这样创建一个 jquery“插件”。这是一个简单的例子。 

(function($){
    $.fn.setHeight = function(val){
        return this.each(function(){
            // do calculations here and assign height ...
            $(this).height(val);
        });
    }
})(jQuery);

然后您可以这样称呼它：$('#mydiv').setHeight(1.8)当然，它适用于任何 jquery 选择器。

于 2012-12-11T20:38:09.250 回答