我正在使用jquery-ui,并且在某些时候我使用show和hide函数非常重要地为进出的变化图像制作动画。
出于某种原因,经过几次尝试,我的页面上的控件突然停止响应点击。在使用firebug进行了一些激动之后,我发现我的页面中充满了类 ui-effects-wrapper 的div。
我不知道为什么会发生这种情况或者如何阻止它。如果我删除这些div,我就再也看不到我动画的图像了。
有什么想法吗?
答案 0 :(得分:3)
ui-effects-wrapper由jquery UI效果插件添加。
以下是一些来自jquery.effects.core.js的代码:
// Wraps the element around a wrapper that copies position properties
createWrapper: function(element) {
// if the element is already wrapped, return it
if (element.parent().is('.ui-effects-wrapper')) {
return element.parent();
}
// wrap the element
var props = {
width: element.outerWidth(true),
height: element.outerHeight(true),
'float': element.css('float')
},
wrapper = $('<div></div>')
.addClass('ui-effects-wrapper')
.css({
fontSize: '100%',
background: 'transparent',
border: 'none',
margin: 0,
padding: 0
});
element.wrap(wrapper);
wrapper = element.parent(); //Hotfix for jQuery 1.4 since some change in wrap() seems to actually loose the reference to the wrapped element
// transfer positioning properties to the wrapper
if (element.css('position') == 'static') {
wrapper.css({ position: 'relative' });
element.css({ position: 'relative' });
} else {
$.extend(props, {
position: element.css('position'),
zIndex: element.css('z-index')
});
$.each(['top', 'left', 'bottom', 'right'], function(i, pos) {
props[pos] = element.css(pos);
if (isNaN(parseInt(props[pos], 10))) {
props[pos] = 'auto';
}
});
element.css({position: 'relative', top: 0, left: 0, right: 'auto', bottom: 'auto' });
}
return wrapper.css(props).show();
},
答案 1 :(得分:0)
在一个函数中,我有一些代码可以切换两个按钮的可见性,并使用fadeTo和bounce等效果。偶尔还会有一个包装器。 我尝试将此添加到我的方法中,其想法是在效果排队后1.1秒删除包装器。
setTimeout('$(".ui-effects-wrapper").children().unwrap();', 1100);
这会删除过时的包装器,但它也有可能删除后续用于效果的包装器。
我非常有兴趣看到这种技术有任何改进。