0

Jquery スターター ここで私の問題は、[ホーム]、[バージョン情報]、[連絡先]、および [ログイン] をクリックするたびにタブが表示されないことです。これを修正するにはどうすればよいですか? これをどのように修正できるかについてのアイデアは、私にとって大きな助けになります。ありがとうございます。

//私のコードの行

    <!DOCTYPE HTML>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>trial</title>
    <link rel="stylesheet" href="css/reset.css" type="text/css">
    <link rel="stylesheet" href="css/style.css" type="text/css">
    <script src="http://code.jquery.com/jquery-1.8.1.js"></script>
    <script>
        $(function () {
            var tabContainers = $('section.tabs > article');
            tabContainers.hide().filter(':home').show();

            $('section.tabs ul.tabsNav a').click(function () {
                tabContainers.hide();
                tabContainers.filter(this.hash).show();
                $('section.tabs ul.tabsNav a').removeClass('selected');
                $(this).addClass('selected');
                return false;
            }).filter(':home').click();
        });
    </script>
</head>
<body>
<div id="siteWrapper">
    <header id="siteHead">
        <h1>Header</h1>
    </header>   
    <nav id="siteNav">
        <h1>Navigation</h1>
        <ul class="tabsNav">
            <li><a href="#home">Home</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#contact">Contact</a></li>
            <li class="log"><a href="#login">Log In</a></li>
        </ul>
    </nav>
    <section id="siteContent" class="tabs">
        <h1>Section</h1>
        <article id="home">
            <h2>Home</h2>
            </article>
        <article id="about">
            <h2>About</h2>
        </article>
        <article id="contact">
            <h2>Contact</h2>
        </article>
        <article id="login">
            <h2>Login</h2>
        </article>
    </section>
    <footer id="siteFooter">
        <h1>Footer</h1>
    </footer>
</div>
</body>
</html>
4

1 に答える 1

1

これが実用的なフィドルです。それがあなたが望むものかどうか私に知らせてください。

http://jsfiddle.net/Y6STE/1/

于 2012-08-31T08:58:20.903 に答える