在第二个下拉菜单元素上重复下拉javascript效果

Question

我想复制点击'联系'菜单元素下拉效果'生物'菜单元素

http://www.dawaf.co.uk/jj/

我在header.php中重复了html代码：

<!-- contact -->
<section id="contact">
    <!-- container -->
    <div class="container">
                <p>Creative Consultant / Stylist<br /><br /><a href="mailto:info@janinejauvel.co.uk">info@janinejauvel.co.uk</a><br />
                +44(0) 7983 572330</p>

    </div>
    <!-- .container -->

</section>
<!-- .contact -->

<!-- bio -->
<section id="bio">
    <!-- container -->
    <div class="container">
                <p>Testing this shows up</p>

    </div>
    <!-- .container -->

</section>
<!-- .bio -->

我已经复制了CSS

我不确定我需要编辑哪些javascript才能在script.js上获得相同的效果：

    /* Show the portfolio
     ------------------------------------------------- */

    $('#portfolio-catcher').click(function() {

        $('h1 a').trigger('click');

        return false;

    });

    $('a[href="#portfolio"]').click( function () {

        // hide contact 
        $('#contact').stop().slideUp({
            duration: 250, 
            easing: 'easeInOutCubic'
        });

        // remove the iframe content (for vimeo videos)

        $('iframe').remove();

        hattie.showPortfolio();

        return false;


    });

    /* Contact section click
         ------------------------------------------------- */
        $('a[href="#contact"]').click(function() {

            // hide slideshow whatever
            $('#slideshow').stop().slideUp({
                duration: 300, 
                easing: 'easeInOutCubic'
            });     

            // show contact
            $('#contact').stop().slideDown({
                duration: 300, 
                easing: 'easeInOutCubic'
            });

            hattie.showPortfolio();

            return false;

    });

    /* Launching a project
     ------------------------------------------------- */

    $('hgroup').click(function() {

        // scroll to top
        $.scrollTo(0, 250);

        $hgroup     = $(this);
        // hide contact 

        if ($('#contact').is(':visible')) {

            $('#contact').stop().slideUp({
                duration: 250, 
                easing: 'easeInOutCubic'
            });
        }

        // show the loading gif in the container
        $('#slideshow-container').html('<div class="loading"><img src="/assets/img/loading.gif" alt="loading"/></div>');

        $('section#work').stop().animate({
            'margin-top' : '+=' +($(window).height() - 55) + 'px'
        }, 700, 'easeInOutCubic', function () {

            // load the project into the slideshow container div
            $('#slideshow-container').load('' + $hgroup.attr('data-project'), function() {
                // bind slideshow
                    slideshow.render();
                    $('section#work').css('margin-top', '0px');
            });

        });

        return false;

    });

}, 

this.folioLinkShow  = function() {

    if ($('.slide').length > 1) {


        $('#portfolio-catcher').hover(function() {

            $('nav#show-projects div').slideDown(200);


        }, function () {

            $('nav#show-projects div').slideUp(200);

        });


    } else {

        $('nav#show-projects').unbind();

    }
}, 

this.loadImages     = function() {

Answer 1

让你的“Bio”href如下： #bio

然后，将其添加到您的Javascript中（它将完成与联系人点击相同的操作：

/* Contact section click ------------------------------------------------- */
$('a[href="#contact"]').click(function() {
    // hide bio
    if ($('#bio').is(':visible')) {
        $('#bio').stop().slideUp({
            duration: 250, 
            easing: 'easeInOutCubic'
        });
    }
    // hide slideshow whatever

        $('#slideshow').stop().slideUp({
            duration: 300, 
            easing: 'easeInOutCubic'
        });     

        // show contact
        $('#contact').stop().slideDown({
            duration: 300, 
            easing: 'easeInOutCubic'
        });

        hattie.showPortfolio();

        return false;

});

/* Bio section click ------------------------------------------------- */
$('a[href="#bio"]').click(function() {
    // hide contact 
    if ($('#contact').is(':visible')) {
        $('#contact').stop().slideUp({
            duration: 250, 
            easing: 'easeInOutCubic'
        });
    }

    // hide slideshow whatever
    $('#slideshow').stop().slideUp({
        duration: 300, 
        easing: 'easeInOutCubic'
    });     

    // show contact
    $('#bio').stop().slideDown({
        duration: 300, 
        easing: 'easeInOutCubic'
    });

    hattie.showPortfolio();

    return false;

});