我正在尝试在 drupal 7 中的页面加载和窗口大小调整时调整几个 div 的大小。
主题信息
name = Theme
description = The Theme
core = 7.x
stylesheets[all][] = css/style.css
scripts[] = js/scripts.js
(the rest)
脚本.js
$(window).load(function() {
getViewport();
});
$(window).resize(function() {
getViewport();
});
function getViewport() {
alert('function hit');
var viewportwidth;
var viewportheight;
if (typeof window.innerWidth != 'undefined')
{
viewportwidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
viewportheight = window.innerHeight || document.documentElement.clientHeight || document.body.clientWidth;
}
document.getElementById("content").style.height = (window.innerHeight - 150) + 'px';
document.getElementById('sidebar-first').style.height = (window.innerHeight - 50) + 'px';
}
但无论是加载、调整大小、功能还是受到打击。我确信这是我在 drupal 中使用它的无知,但我似乎找不到答案。
我什至尝试在信息文件中包含我自己的 jquery 库,但没有成功。
谢谢
最佳答案
此代码不需要 jQuery 即可工作,只需创建一些事件监听器并终止 $(window)
方法链。
window.addEventListener('load', function() { getViewport() });
window.addEventListener('resize', function() { getViewport() });
注意:
如果您需要定位低于 IE9 的目标,则需要标准化 addEventListener()
。像这样的东西:
if ( window.addEventListener ) {
// Modern browsers
window.addEventListener('load', function() { getViewport() });
window.addEventListener('resize', function() { getViewport() });
} else
// Browsers that need to die
window.attachEvent('onLoad', function() { getViewport() });
window.attachEvent('onResize', function() { getViewport() });
}
关于javascript - 在 Drupal 7 中执行 $(window).load() 和 $(window).resize(),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20527765/