Wordpress中的水平滑动面板,显示第一个面板

时间:2014-06-19 08:36:44

标签: javascript jquery html wordpress

我正在主页上创建一个带有jQuery的滑动面板,其中包含5个面板,下面是代码。

<script type="text/javascript">
jQuery(function($) {

$('a.panel').click(function() {
    var $target = $($(this).attr('href')),
        $other = $target.siblings('.active');

    if (!$target.hasClass('active')) {
        $other.each(function(index, self) {
            var $this = $(this);
            $this.removeClass('active').animate({
                left: $this.width()
            }, 500);
        });

        $target.addClass('active').show().css({
            left: -($target.width())
        }).animate({
            left: 0
        }, 500);
    }
});

});

目前我需要点击查看面板。有没有办法让我可以在没有点击的情况下制作第一个面板?

HTML是:

<div class="panel" id="target1" >
        <div class="inner blue">
            <?php the_field( "dm" );?>
        </div>

    </div>

 <div class="panel" id="target2">
     <div class="inner green">
            <?php the_field( "rd" );?>
     </div>
</div>

<div class="panel" id="target3">
    <div class="inner brown">
        <?php the_field( "cd" );?>
    </div>
</div> 

...等

0 个答案:

没有答案