jQuery的调整在火狐,Chrome和Safari浏览器不工作

问题描述:

$("#dvMyDIV").bind("resize", function(){ 
    alert("Resized"); 
}); 

jQuery的调整在火狐,Chrome和Safari浏览器不工作

$("#dvMyDIV").resize(function(){ 
    alert("Resized"); 
}); 

的问题

  1. 这是为什么不火狐,Chrome和Safari的工作?
  2. 这可以被认为是一个jQuery的bug,因为调整大小不处理其他浏览器?
  3. 唯一的解决方法是调用SetTimeout函数检查clientHeight和clientWidth吗?
  4. 使用jQuery的任何解决方法?

我相信JavaScript resize事件只适用于框架或窗口,而不适用于DIV。

例如请参阅this page

只要用户或脚本调整窗口或框架大小,onResize偶处理程序就用于执行指定的代码。这使您可以查询的大小和窗口元素的位置,动态重置SRC属性等

所以,如果你想检测时,窗口大小,在jQuery的你应该使用$(window).resize(function() { });

编辑:如果你想看DIV的大小,这取决于你的意图是什么。如果您使用JavaScript调整大小,那么您可以实现一个方法来执行调整大小,并让该调用调用任何其他调整大小的代码。否则,如果你只是在观察DIV调整窗口大小时,是否只是将调整大小侦听器附加到窗口,然后检查DIV是否已被调整大小(即存储宽度/高度的旧值并在调整大小时检查它们)?尽管我不知道这是否完全与浏览器兼容(可能这是Mozilla专用),但您可以考虑在宽度/高度属性上使用watch。我确实发现this jQuery plugin看起来像它可能会做同样的事情,虽然(稍作修改)。

+0

OP可能需要下面提到的Ben Alman调整插件。 – 2012-07-26 09:47:33

你为什么期望#dvMyDIV被调整大小?也许是因为别的原因调整了这个元素,也许窗口被调整了大小?如果是这样,尝试

$(window).resize(function(){alert("Resized");}); 

我可能会建议是这样的:在页面加载

1),让您的DIV的宽度,并把它放在一个全局变量

2)上执行任何直接或隐式调整该div的大小(我认为这是一个JavaScript驱动的事件),检查新宽度与旧宽度,并用新宽度更新全局值。

你是否试图将myDiv设置为特定大小?

请尝试下面的JavaScript代码。我用它来调整一个基于从flash文件返回的高度来保存flash对象的div,并且它对我来说似乎工作正常。

function setMovieHeight(value) { 
    var height = Number(value) + 50; 
document.getElementById("video").height = height; 
} 

jQuery的equivilent应该是:

function setHeight(value) { 
    var height = number(value) + 50; 
    $('#MyDiv').attr('height') = height; 
} 

调整大小并似乎只适用于Windows对象。

这里有一个更精致的实例,它根据窗口大小调整事件做了大量的调整数学大小。在ff 3.6,safari 4.0.4和chrome中出色地工作。这是3.5中的一个小矮人。因此,它应该在Mozilla和webkit中跨板使用。我避开了其他BROWSER,因为我真的不喜欢它,并且代码非常干净而不必考虑它。我意识到我必须克服这一点,我必须忍受它和IE附加费。

反正链接:

http://fridaydev.com/bookmap/proport3.html

这不是一个问题:为什么?正如我们要求的那样,我们希望在调整DIV时监控DIV。

对于明显的例子,jQuery UI可调整大小。是的,用户通过鼠标拖动来调整div的大小,现在呢?也许里面的内容是调整大小的,我们想知道它。我们是否应该将所有的代码放在原始高速缓存代码中的一个巨型熔炉中?我不这么认为。

另一个快速浏览器,什么都不做,叹气。

与MSIE一切正常。对于Firefox,我想你必须使用一些倾斜技术,例如将元素的原始宽度/高度存储在自定义属性中并使用$(elem).bind('DOMAttrModified', func)。然后在func()回调中,检查新的宽度/高度是否与先前存储的宽度/高度不同,请分别调整大小并将它们再次存储以用于下一个事件回调。请注意,这种方法仅适用于Firefox。我还没有找到适合Chrome,Safari和Opera的体面解决方案。也许使用window.setInterval()会做,但是......听起来太slopy ......事件它的想法让我有点恶心:(

+1

+1:这很好! – naveen 2011-10-26 13:14:38