编辑：

Question

我的图像宽度为723，高度为425，我需要div.col-75-liquid元素宽度才能获得图像宽度和高度的宽高比，这样当浏览器调整大小时我的滑块将保持它的纵横比我必须在jquery中执行此操作而不是在css中。我如何在jquery中执行此操作？有人能让我举一个有长宽比的div元素的例子，col-75液体是弹性的，所以它会增长和缩小

当我有宽高比时，我可以在浏览器调整大小时重新创建我的控件，并为我的控件设置新的宽度和高度

<div class="col-75-liquid">
    <div class="img">
    </div>
</div>

Answer 1

好吧，如果没有CSS和诸如此类，这会在调整窗口大小时将父div重新调整为图像尺寸的150％。这将保持方面，因为您正在将父级与图像本身进行比较。如果您希望我进一步扩展，请告诉我。

<强> HTML：

<div id="wrapper">
    <img id="slide1" src="whatever.jpg" />
</div>

<强> jQuery的：

$(window).on('resize', function() {
    $('#wrapper').height($('#slide1').height() * 1.5);
    $('#wrapper').width($('#slide1').width() * 1.5);
});

http://jsfiddle.net/SinisterSystems/fJpwf/2/

我没有做任何响应，但如果你的其他CSS（甚至其他jQuery函数）正在控制它，它会响应。如果你愿意，我可以举出另一个例子。

编辑：

不明白这个问题。

尝试这样的事情：

http://jsfiddle.net/SinisterSystems/fJpwf/3/

<div class="wrapper">
    <img class="slide1" src="image.jpg" />
</div>

$(window).on('resize', function() {
    $('.wrapper').height($('.wrapper').width() * .58);    
});

这将使包装器保持图像的纵横比，尽管它的大小。

换句话说，如果您知道父元素的width，请执行以下操作：

$('.parent').height($('.parent').width() * .58);

如果你知道身高并需要宽度，请使用：

$('.parent').width($('.parent').height() * 1.7);

div宽高比乘父宽度

1 个答案:

编辑：

http://jsfiddle.net/SinisterSystems/fJpwf/3/