【发布时间】:2011-01-14 16:38:37
【问题描述】:
当用户将鼠标悬停在链接上时,我有一个使用 jquery 下拉的 div。 div 的 css 在这里:
.mask-layer {
height: 0;
overflow: visible;
position: relative;
top: 54px;
float: right;
z-index: 1000;
}
.slidedown {
height: auto;
width: 300px;
background: url(../images/bg_shopping_bag_span.png); background-repeat:repeat-y;
color: white;
}
Html 只是遮罩层 div 内的滑动 div。出于某种原因,我无法在此处发布任何角括号向您展示。
最后是 jquery:
jQuery(document).ready(function() {
jQuery('.slidedown').hide();
jQuery('a.top-link-cart').hover(function() {
jQuery('.slidedown').stop(true, true).animate({
height: ['toggle', 'swing'],
}, 600, function() {});
}, function() {
jQuery('.slidedown').mouseout(function() {
setTimeout(function() {
jQuery('.slidedown').stop(true, true).animate({
height: '0px'
}, 600, function() {});
}, 200 );
});
});
});
该下拉菜单在 Internet Explorer 和 Firefox 中运行良好。但是在 chrome 中,向下滑动的 div 出现在页面上的错误位置。它出现在屏幕边缘页面上的所有其他 div 之外。有没有办法解决这个问题?我应该提一下,当我禁用 jquery 时,div 没有隐藏也没有动画,即使在 chrome 中它也处于正确的位置。所以也许这是jquery问题?感谢您的建议。
【问题讨论】:
-
复制链接怎么样?实时页面或 jsfiddle.net 之类的内容都会非常有帮助。