我正在使用snipplr中的这个脚本,我如何设置它以使容器div比newWindowHeight高度小100px,比如-100或者什么。
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
//If the User resizes the window, adjust the #container height
$(window).bind("resize", resizeWindow);
function resizeWindow( e ) {
var newWindowHeight = $(window).height();
$("#container").css("max-height", newWindowHeight );
}
});
</script>
答案 0 :(得分:30)
您发现的脚本过于复杂了问题。以下对我有用:
$(function(){
// Cache reference to our container
var $container = $("#container");
// A function for updating max-height
function updateMaxHeight () {
$container.css("max-height", $(this).height() - 100);
}
// Call updateMaxHeight when browser resize event fires
$(window).on("resize", updateMaxHeight);
});
一个警告是调整浏览器大小时调用resize事件;它不仅仅是在浏览器调整大小后调用的。因此,您可以将回调函数调用数百次 - 这通常是一个坏主意。
解决方案是遏制或去除事件。限制意味着你不会让回调在一段时间内被触发超过x次(可能是每秒5次)。去抖意味着你从最后一次调整大小事件经过一段时间后触发回调(等到调整大小事件后500毫秒)。
jQuery目前不支持限制或去抖动选项,尽管有插件。 Other popular libraries you may have used do have these features,例如下划线:
$(function(){
// Cache reference to our container
var $container = $("#container");
// A function for updating max-height
function updateMaxHeight () {
$container.css("max-height", $(this).height() - 100);
}
// Version of updateMaxHeight that will run no more than once every 200ms
var updateMaxHeightThrottled = _.throttle(updateMaxHeight, 200);
// Call updateMaxHeightThrottled when browser resize event fires
$(window).on("resize", updateMaxHeightThrottled);
});
答案 1 :(得分:0)
我刚看到名为&#34; onResize&#34;的HTML事件属于特别标签 使用这种用法,它会比java检测具有更高的性能。
<body onresize="functionhere()">
我希望它会帮助你们..