使用jQuery根据窗口大小来改变滑块的CSS高度(Use jQuery to change css

我发现解决方案非常接近我想要的，但因为我的编程经验有限，我不能让他们为我工作。

我想要做的是改变内部根据窗口大小两个同轴CSS标签的参数。

在我的网站，我需要改变这三个参数（特别是改号515在以下）：

• 1）内联的CSS： <div id="rev_slider_1_1" class="rev_slider fullwidthabanner" style="display:none;max-height:515px;">
• 2）内嵌CSS： <div id="rev_slider_1_1_wrapper" class="rev_slider_wrapper fullwidthbanner-container" style="margin:0px auto;padding:0px;margin-top:0px;margin-bottom:0px;max-height:515px;">

我需要做的是改变515根据窗口的宽度：如果窗口宽度超过1280 ，我想价值的高度是515 ，如果低于1280 ，我想的高度是615如果宽度小于480使高度715 。

此代码（摘自这里 ）似乎是我所需要的，但我无法弄清楚如何修改代码为我的具体情况：

jQuery.event.add(window, "load", resizeFrame);
jQuery.event.add(window, "resize", resizeFrame);

function resizeFrame() 
{
    var h = $(window).height();
    var w = $(window).width();
    $("#elementToResize").css('height',(h < 1024 || w < 768) ? 500 : 400);
}

任何人都可以给我一些帮助吗？ 我想我只需要在屏幕做到这一点的宽度，但我不知道。 非常感谢！

Answer 1:

这是你会如何写你的条件：

$(window).on('load resize', function () {
  var w = $(window).width();
  $("#rev_slider_1_1 #rev_slider_1_1_wrapper")
    .css('max-height', w > 1280 ? 515 : w > 480 ? 615 : 715);
});

文章来源: Use jQuery to change css height of slider based on window size