基于jQuery的按钮滑块

Question

我正在创建我的第一个 jquery 函数。视图窗口上方有一组按钮。视图窗口使用 div 进行初始化，当按下其中一个按钮时，相应的 div 会滑入视图窗口。

它在 firefox 中可以正常工作（在任何其他浏览器中都不起作用），但最终没有 div 滑入视图窗口。我认为问题与 css left 值超出范围有关，但我不确定如何解决。

js

$(function() {
var prevButton = 3;
$("#par3").show();

$(".window_control").click(function() {
    var cur = this.id;

    if(cur != prevButton){

        var activeItem = $("#par"+prevButton);
        var nextItem = $('#par'+cur);

        var slider = $(".slider");
        var finalWidth = slider.width()*2;
        var animationTime = 2000;

        var cssDir = (prevButton > cur) ? "right" : "left";
        var animation = (prevButton > cur) ? { left: '+=' + finalWidth } : { left: '-=' + finalWidth };

        prevButton = cur;

        activeItem
            .animate(animation, animationTime);

        nextItem
            .show()
            .css(cssDir, finalWidth)
            .animate(animation, animationTime);
    }
    return false;
  });
}); 

Answer 1

您不使用本机的任何原因：

 $('div').show("slide", { direction: "left" }, 1000);