反转图像的响应大小

Question

我正在尝试在响应式网站上使用以下设计。我很好奇是否有办法通过jQuery / Javascript设置某种反向调整大小的方法，因为随着视口变小，副本将响应并获得更大。

我尝试使用jQuery来修改图像大小，但我只知道在不同的断点处手动调整大小

这是我尝试解决方案：

var viewportWidth = $(window).width();

if (viewportWidth <= 768) {
$("#curlybrace").css("width", "80px");
}

有没有办法设置动态缩放图像？

Answer 1

尝试查看CSS和媒体查询，似乎比尝试使用JS更简洁。

Answer 2

您可以使用以下内容：

 function resizeFn() {
   var width = window.width();
   // ...
 }

 $(function() {
   $(window).resize(resizeFn).trigger('resize');
 });

不可能与CSS做反向，我不认为（我想可能通过calc（），但我不认为它可以让你做那样的单位操作。）

公平警告，这听起来不是一个好的设计，除非你试图让它看起来很疯狂。