0

サイトのメニューを作成しています。リンクのクリック効果にホバーを変更しようとしています。

サブメニューにカーソルを合わせると、メニュー項目を変更する必要があります。

これはコードです

<li class="dropdown">
            <a href="#">item 1</a>
            <ul>
                <li><a href="#">subitem 1</a></li>
                <li><a href="#">subitem 2</a></li>
                <li><a href="#">subitem 3</a></li>
                <li><a href="#">subitem 4</a></li>
            </ul>
        </li>
        <li class="dropdown">
            <a href="#">item 2</a>
            <ul>
                <li><a href="#">subitem 1</a></li>
                <li><a href="#">subitem 2</a></li>
                <li><a href="#">subitem 3</a></li>
                <li><a href="#">subitem 4</a></li>
            </ul>
        </li>

およびcss

.nav>li>a {
            position: relative;
            display: block;
            width: 150px;
            margin-left: -5px;
            padding: 10px 10px 10px 15px;
            font-family: 'Open Sans', sans-serif;
            font-size: 14px;
            letter-spacing: 1px;
            font-weight: 900;
            text-decoration: none;
            color: #383838;
}
.nav>li>a:hover, .nav>li:hover>a {
            color: white;
            width: 169px;
            height: 4px;
            background: -webkit-linear-gradient(bottom, #A30C0C, #C42D2D);
            background: -ms-linear-gradient(bottom, #A30C0C, C42D2D);
            background: -moz-linear-gradient(bottom, #A30C0C, C42D2D);
            background: -o-linear-gradient(bottom, #A30C0C, C42D2D);
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff',                         endColorstr='#f3f3f3',GradientType=0);
}

私を助けてください

4

1 に答える 1

0

このようなものが必要ですか：サンプル

$(".dropdown ul").hide();
$(".dropdown ul li").click(function(){
     $(this).parent().prev('a').html($(this).text());
});
$(".dropdown").hover(function(){
     $(this).find('ul').stop(true,true).slideDown('normal');
      }, function(){
     $(this).find('ul').stop(true,true).slideUp('normal');
});
于 2013-03-09T16:14:15.060 に答える