chrome中的div位置问题

时间:2011-01-14 16:38:37

标签: jquery html css magento

当用户将鼠标悬停在链接上时,我有一个使用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只是mask-layer div中的slidedown 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问题?谢谢你的任何建议。

1 个答案:

答案 0 :(得分:0)

如果您从float: right

中删除.mask-layer,是否有效?

如果有,请尝试将clear: both放入.slidedown