0

ユーザーがさまざまなナビゲーション リンクをクリックしたときに、コンテンツをページからスライドさせて、ページのコンテンツを変更しようとしています。これまでのところ、ホームページからスライドして、正常に機能する他のページの 1 つに移動できます。しかし、最初のページにスライドして戻る方法がわかりません。

最初のページにスライドするために使用するスクリプト:

        <script>
            function slide(div)
            {
                if(div == "work")
                {
                    $('#home').hide('slide', {direction: 'left'}, 1000);
                    $('#work').delay(600).show('slide', {direction: 'right'}, 1000); 
                }
            }
        </script>

ナビゲーション メニューに沿ってスライドするコンテンツ:

        <div class='nav'>
            <table class='nav'>
                <tr>
                    <td width='23%'><a href='index.html' onclick='slide("home");' class='link'>home</a></td>
                    <td width='23%'><a href='#' onclick='slide("work");' class='link'>work</a></td>
                    <td width='23%'><a href='#' class='link'>about</a></td>
                    <td width='31%'><a href='#' class='link'>contact</a></td>
                </tr>
            </table>
        </div>
        <div class='content' id='home'>
            <h1>hello</h1>
            <table class='content'>
                <tr>
                    <td><img src='images/icon1.png' class='icon'></td>
                    <td><p>i’m thobias nordgaard. a front and back end<br>
                    developer from denmark. i love what i do,<br>
                    hopefully you will too.<br><br>

                    Im fluid in html, css, php and improving in<br> 
                    javascript, jquery and sass. if you dont know<br>
                    what these things are, all they mean is: i can<br>
                    make websites.</p></td>
                </tr>
            </table>
        </div>

        <div class='content' id='work'>
            <h1>work</h1>
            <table class='content'>
                <tr>
                    <td><img src='images/icon1.png' class='icon'></td>
                    <td><p>I haven't completed any work yet :(</p></td>
                </tr>
            </table>
        </div>
4

1 に答える 1