3

私はテニスクラブのウェブサイトを構築していて、いくつかのインスピレーションを得るためにさまざまなクラブのウェブサイトを探しています。

私は以前に私の問題のいくつかの解決策について読んだことがありますが、ウェブマスターフォーラムから具体的なアドバイスを受けたことはありません。

どうすれば次のようなことを達成できますか？

メニュー：

       - Home
       - About the Club

次に、ユーザーが[クラブについて]をクリックすると、メニューは次のようになります。

       - Home
       - About the Club
            Members
            Prices
            Tournaments

そうでない場合でも、必要な結果をさらに説明するための画像を提供できることを願っています。

PSこれはCSSとJavaScript（おそらくJQueryのようなフレームワーク）だけを使用して達成可能であり、ソリューションを具体的に特定することはできません。PHP/MySQLをサポートしていないサーバーでPHPを使用することはできません。

4

3 に答える 3

4

ネット全体に垂直ナビゲーションメニューのチュートリアルとリソースがあります。このトピックについて調査することをお勧めします。

チュートリアルの例を次に示し ます。http ：//www.noupe.com/css/multilevel-drop-down-navigation-menus-examples-and-tutorials.html

リソースの例を次に示します。http： //codecanyon.net/item/jquery-vertical-dropdown-menu/161210

ただし、ここでは、開始するための非常に単純なコードをいくつか示します。

<ul>
    <li><a href="#">Home</a></li>
    <li>
        <a href="#">About the Club</a>
        <ul>
            <li><a href="#">Members</a></li>
            <li><a href="#">Prices</a></li>
            <li><a href="#">Tournaments</a></li>
        </ul>
    </li>
</ul>
<style>
ul ul { display:none; }
</style>
<script src="jquery-1.7.2.min.js"></script> 
<script>
$("li").click(function() {
    $(this).find("ul").css("display", "block");
    return false;
});
</script>

これはjQueryを使用するため、http：//jquery.com/からダウンロードして含める必要があります。

于 2012-07-22T00:57:35.307 に答える
3

始めたばかりの人にとって最も簡単なCSSメニュージェネレーターを使用します。使用するのに適したものはhttp://purecssmenu.com/です。

于 2012-07-22T00:26:35.417 に答える
1

ここでも同じですが、無料のメニュージェネレーターは次のCSS3とHTML5を使用します。
無料のHTMLCSSメニュージェネレータオンライン

于 2014-05-13T11:39:56.427 に答える