我找到了非常接近我想要的解决方案,但由于我有限的编程经验,我无法让它们为我工作。
我想做的是根据窗口大小更改两个内联 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);
}
谁能帮帮我?我想我只需要屏幕的宽度就可以做到这一点,但我不确定。非常感谢!
最佳答案
您可以这样写您的条件:
$(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);
});
关于javascript - 使用 jQuery 根据窗口大小更改 slider 的 css 高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12234413/