0

这个脚本是否会获得一个在鼠标悬停时下拉的 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>
4

2 回答 2

0

这是你需要的吗?
链接
JS:

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

CSS:

.cart_holder {cursor:pointer; }
于 2013-10-09T12:28:19.470 回答
0

希望这可以帮助你。我稍微改变了结构。也改变了visibility属性.. :)

使用Jquery

http://jsfiddle.net/RKrsu/

使用CSS

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

谢谢皮特:)

于 2013-10-09T12:25:58.003 回答