使用jQuery根据窗口大小更改滑块的css高度

我发现解决方案非常接近我想要的，但由于我的编程经验有限，我无法让它们为我工作。使用jQuery根据窗口大小更改滑块的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。

（从here拍摄）此代码似乎是我所需要的，但我无法弄清楚如何修改代码为我的具体情况：

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); 
}

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

来源

2012-09-02 Nathan

最大高度 - 谢谢！ – Nathan

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

$(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); 
});

来源

2012-09-02 08:41:09

谢谢！我编辑的问题只处理CSS - 然后打开另一个问题特别为jQuery选项更改在这里：http://stackoverflow.com/questions/12241668/change-jquery-slider-option-dynamically-based-on-window -宽度 – Nathan

使用jQuery根据窗口大小更改滑块的css高度

回答

相关问题