在Drupal 7中执行$(window).load()和$(window).resize()

Executing $(window).load() and $(window).resize() in Drupal 7

本文关键字:window load resize Drupal 执行      更新时间:2024-06-22

我试图在drupal7中调整页面加载和窗口大小的几个div。

主题信息

name = Theme
description = The Theme
core = 7.x
stylesheets[all][] = css/style.css
scripts[] = js/scripts.js
(the rest)

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