SlideRight和SlideLeft jQuery问题

时间:2015-01-22 10:22:23

标签: jquery

我希望当我点击一个项目时,显示一个div并向右滑动。当我点击另一个项目时,我想要隐藏该div或向左滑动它。我怎么能这样做?

这是我的代码:

$(document).ready(function() {
        $(".sidePanel").hide();
        $(".trigger-reverse").hide();
        $(".trigger").css("margin-left","-15px");

        $(".trigger").click(function() {  //slide right

            $(this).hide();
            $(".trigger-reverse").show();
            $(".sidePanel").show();
        });
        $(".trigger-reverse").click(function() {   // slide left
            $(this).hide();
            $(".trigger").show();
            $(this).css("margin-left","0px");
            $(".sidePanel").hide();
        });
     });

1 个答案:

答案 0 :(得分:0)

我选了一个div和两个按钮,按钮ID button1 button2

$("#button1").click(function () {

// Set the effect type
var effect = 'slide';

// Set the options for the effect type chosen
var options = { direction: "left" };

// Set the duration (default: 400 milliseconds)
var duration = 500;

$('#myDiv').toggle(effect, options, duration);
});

$("#button2").click(function () {

// Set the effect type
var effect = 'slide';

// Set the options for the effect type chosen
var options = { direction: "right" };

// Set the duration (default: 400 milliseconds)
var duration = 500;

$('#myDiv').toggle(effect, options, duration);
});

请检查 fiddler here中的类似情况,我希望这符合您的要求。我希望我的回答很有帮助