0

1つのスクリプトに問題があります。それは単純なことだと思いますが、残念ながら私にとってはそれほど単純ではありません。私がやろうとしているのは、divを表示することです（クリックすると表示されます）。「製品」をクリックすると発生します。私がこれまでに持っているのはこれです：

   <div id="header">

    <div id="headcont"> 

            <div id="main-menu">
                <a href="#" id="button-products">Products</a>
            </div>

            <div id="products-menu">
                <a href="#">Jackleg units</a>
                <a href="#">Antivandal units</a>
                <a href="#">Storage containers</a>
            </div>

    </div>
</div>

およびcss：

    body{

    background-color:#666;

}

#header{
    position:absolute;
    top:0px;
    background-color: rgba(0, 0, 0, .9);
    width:100%;
    height:70px;
    border-bottom:1px #999 solid;
    padding:15px 0;
    z-index:200;
}

#headcont{
    overflow:hidden;
    width: 480px;
    margin: 0 auto;
}

#main-menu{
    margin-top:55px;
    float:right;
}

#main-menu a{
    display:block;
    width: auto;
    font-size:1.7em;
    float:left;
    margin: 0 10px;
    color:#eee;
}

#products-menu{
    overflow:hidden;
    background-color: rgba(255, 255, 255, .8);
    width:980px;
    display: none;
}

#products-menu a{
    display:block;
    width: auto;
    background-color:rgba(0, 0, 0, .6);
    padding: 5px;
    margin: 2px 5px 2px 0;
    text-decoration:none;
    font-size:1.7em;
    float:left;
    color:#eee;
}

  • 主なもの-jquery：

    $(function() {
    $('#button-products').on('click', function() {
        $('#products-menu').css("display:","block");
    });
});

少し長いので、jsfiddleを使用して、私がやろうとしていることを理解できるようにしました：JSFIDDLE。ご助力ありがとうございます。

4

2 に答える 2

2 
$("#products-submenu").click(function(){

    $("#products-menu").show(); //.fadeIn(600) //Nice Effect

});
于 2013-01-25T23:27:34.340 に答える
2

設定しているCSSプロパティの最後にコロンがあるため、コードは機能しません。

$('#products-menu').css("display:","block");
// remove this -----------------^

それを削除すると機能します：http：//jsfiddle.net/7tbsR/4/

（フィドルの左側のパネルでjQueryが選択されていないため、どちらも役に立ちませんでした。）

jQueryには、非表示の要素を表示するためのいくつかのメソッドが用意されていることにも注意してください。これには、非表示のアイテムをフェードまたはスライドさせて表示するプレーンな方法.show()やいくつかのアニメーション方法が含まれます。（あなたのメニュー.slideDown()には素晴らしい効果があります：http：//jsfiddle.net/7tbsR/7/）

于 2013-01-25T23:29:32.840 に答える