Div鼠标悬停，消失

Question

这个脚本是否可以获得一个在鼠标悬停时下拉的div，但是当我用鼠标悬停在它上面时，它会因为下拉而消失div？作为购物卡。

$(document).ready(function() {
    $("div.cart_holder").mouseover(function() {
        $(this).css('cursor', 'pointer');
        $("div.cart_container").css('visibility','visible');
    });
    $("div.cart_holder").mouseout(function() {
        $(this).css('cursor', 'default');
        $("div.cart_container").css('visibility','hidden');
    });
});

<div id="cart">
    <div class="cart_holder">
        <span class="price">1 735 kr</span>
        <a class="icon_cart" href="#"></a>
        <a class="toggle_cart" href="#"></a>
    </div>
    <div class="cart_container" style="visibility:hidden">
        <div class="cart_pro_box">
            <div class="img_holder">
                <img class="img" src="img/street_old_fashion_30594.jpg" alt="Street old Fashion" title="Street old Fashion" />
            </div>
            <div class="rub">
                <span class="title">Street old Fashion 6-Pack</span><br />
                <span class="name_artist">av Jan Johansson</span>
            </div>
            <div class="price">
                <span class="price_pay">1 439 kr</span><br />
                <span class="price_old">1 800 kr</span>
            </div>
        </div>
    </div>

Answer 1

希望这可能有助于你。 我已经改变了一点结构。也改变了visibility属性..：）

使用Jquery

http://jsfiddle.net/RKrsu/

使用CSS

http://jsfiddle.net/peteng/RKrsu/2/

Thanx pete：）

Answer 2

这是你需要的吗？ Link
的 JS：

   $(document).ready(function () {
       $(".cart_holder").mouseover(function () {
           $(".cart_container").show();
       });
       $(".cart_holder").mouseout(function () {
           $(".cart_container").hide();
       });
   });

<强> CSS：

.cart_holder {cursor:pointer; }