首先更改查询滑块滑动为默认幻灯片

时间:2014-01-30 11:57:44

标签: javascript jquery

Demo 01

在演示01中,当我单击#one时,会出现第一张幻灯片。但在点击#one之前,我需要在页面中已有第一张幻灯片。第一张幻灯片必须是滑块的默认幻灯片。

如何更改此代码?

你可以帮忙吗。

$(function () {

    // get the width of the first content box
    // add a bit of extra so we end up with "-350px"
    var contentWidth = '-' + ($('.content').width() + 50) + 'px';

    // reposition the content here in case javascript is disabled
    $('.content').css({
        position: 'absolute',
        left: contentWidth
    });

    $("li a").click(function () {
        event.preventDefault();
        var $blockID = $( $(this).attr('href') );
        // if the content is already showing, don't do anything
        if ($blockID.hasClass('visible')) { return; }
        // hide any visible content
        $('.content.visible')
            .removeClass('visible')
            // move the old content past the current window width, then reset it's position
            .animate({
                left: '-' + $(window).width()
            }, function () {
                // Remove left setting after the animation completes
                $(this).css('left', contentWidth);
            });
        $blockID
            .addClass('visible')
            .animate({ left: 0 });
    });

});

1 个答案:

答案 0 :(得分:1)

试试这个

$("li a:first").trigger("click");
click事件

之后

http://jsfiddle.net/fQs8N/3/

或者,如果你想避免首次出现的动画,试试这个

$('.content:first').css('left', '0px');

点击之前或任何地方

http://jsfiddle.net/fQs8N/4/