CSS悬停格工作不正常

我工作的一个网站，所以我给在顶部菜单的购物车链接CSS div hover效果...CSS悬停格工作不正常

一旦您将在购物车中添加一个产品比hover它在购物车的链接顶部菜单hover div工作不正常时，我徘徊，它的到来而突然消失，没有得到确切的错误....

所以请尝试找出错误.....

我在说这个bug一旦你会看到附加的图像... enter image description here

下面是网站链接： - http://www.aurikjewels.com/index.php/

由于提前预期，当你搬出header-items因为下面财产的DIS-出现

来源

2013-10-16 Shailender Arora

请发布相关的JavaScript/CSS。我99％确定这是因为链接和弹出窗口之间存在差距，所以它会停止显示。 – ediblecode

其完全基于CSS的@danrhul你可以看到现场... –

因为它是按钮显示悬停，当你在'标题项目'，鼠标不在按钮显示。 – pbenard

悬停不工作，

.block-cart-header #header-items 
{ 
    padding:15px; 
}

如果您给padding-top:0px;并添加margin-top: -10px此问题不会发生。

来源

2013-10-16 11:25:21 Kishori

我已经使用填充你的悬停div和我已经试过你的伎俩它不工作..... –

添加margin-top: -10px;到header-items DIV

来源

2013-10-16 11:28:46

通过简单的移动像这样的车，到按钮，显示：

<span class="button-show"><a href="http://www.aurikjewels.com/index.php/checkout/cart/?___SID=U">Shopping Cart</a> 
    - <div id="header-items"> 

      All cart informations      
     </div><span class="price">Rs. 37,212.00</span>      
</span>

并增加了高度，以您的按钮显示：

.block-cart-header .button-show { 
background: url(../images/shopping_bag.png) no-repeat right center; 
color: #FFFFFF; 
float: right; 
font-size: 12px; 
margin: 5px 14px 0 0; 
padding-right: 20px; 
position: relative; 
height: 24px; 
display: inline-block; 
}

这适合我！

来源

2013-10-16 11:30:46

它的工作，但不完全是有一些dis-appearing issus检查它与你的伎俩.... –

问题是.button-show没有足够的高度来容纳事件悬停。
一旦光标移到.button-show和#header-items之间的间隙，悬停就会消失。和#header-items淡入淡出。

为了克服这个问题，你必须做一些事情像

添加padding-bottom: 10px;到class="button-show"为inline style
行看起来像<span class="button-show" style="padding-bottom: 10px;">
添加的.block-cart-header .button-show背景url(../images/shopping_bag.png) no-repeat right 1px

来源

2013-10-16 11:59:13

大家好我已经整理出来的问题....

我删除的

.block-cart-header .actions { display:none !important; }

而现在是工作的罚款...

感谢大家的大力支持。 ..:-)

来源

2013-10-16 12:30:21

CSS悬停格工作不正常

回答

相关问题