0

刚刚使用选项卡完成滚动 div，但试图找出一种制作方法，例如，您单击链接 4，而不是脚本滚动浏览所有 div 以到达数字 4，我希望它滚动出 div1 和在 div4 中滚动

js小提琴：http: //jsfiddle.net/cC4tU/1/

jQuery

$.extend($.easing,
 {
     easeInOutQuad: function (x, t, b, c, d) {
        if ((t/=d/2) < 1) return c/2*t*t + b;
        return -c/2 * ((--t)*(t-2) - 1) + b;
    },
    easeInOutElastic: function (x, t, b, c, d) {
        var s=1.70158;var p=0;var a=c;
        if (t==0) return b;  if ((t/=d/2)==2) return b+c;  if (!p) p=d*(.3*1.5);
        if (a < Math.abs(c)) { a=c; var s=p/4; }
        else var s = p/(2*Math.PI) * Math.asin (c/a);
        if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
        return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b;
    }

    });
//EXPAND PAGE DIV CONTENT
$(".tab_item").hover(function(){
         var background = $(this).parent().find(".moving_bg");
        $(background).stop().animate({
            left: $(this).position()['left']
        }, {
            duration: 700, easing: 'easeInOutElastic'
        });
    });

var TabbedContent = {
    init: function() {    
        $(".tab_item").click(function() {
            var background = $(this).parent().find(".moving_bg");
            $(background).stop().animate({
                left: $(this).position()['left']
            }, {
                duration: 500
            });
            TabbedContent.slideContent($(this));
        });
    },

    slideContent: function(obj) {
        var margin = $(obj).parent().parent().find(".slide_content").width();
        margin = margin * ($(obj).prevAll().size() - 1);
        margin = margin * -1;
        $(obj).parent().parent().find(".tabslider").stop().animate({
            marginLeft: margin + "px"
        }, {
            duration: 1500, easing: 'easeInOutQuad'
        });
    }
}
TabbedContent.init();
4

1 回答 1

1

Dwhizz，你想要的当然是可能的。

我不会为你写它，但据我所知，所有更改都将在slideContent.

战略 ：

  • 隐藏除当前和新的所有 tabslider 元素
  • 根据两个可见项计算边距
  • 动画（可能没有变化）
  • 下次记住当前的 tabslider 元素。
于 2012-08-07T00:03:07.857 回答