2

幅に基づいて div の高さを設定するために使用している jquery コードがいくつかあります。JSFiddle の例はこちら。

すべてがそのまま機能しますが、私が欲しいのは再利用可能な関数であるため、すべての一意の ID に対してまったく同じ関数を作成するわけではありません。$('#biggerHug').setHeight(1.8)現時点では、コードは #bigHug div にのみ適していますが、.readyand.resize関数のようなことを実行して、指定された ID の高さを設定できるようにしたいと考えています。

$(this).width()関数の代わりに$('#bigHug').width()配置することで解決策を試みていましたsetHeightが、すべてが「壊れました」。ロード時またはウィンドウのサイズ変更時に div が表示されません。の代わりに を$(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 に答える