0 
$(".button-wrap.enter-now").click(isMobile ?
    function(){
        window.location = 'form/form.html';
    }
    : function(){
        TweenMax.to($iframeBg, 0.35, {startAt:{top:0}, opacity:1 });
        TweenMax.to($("#form-wrapper"), 0.45, {top:"8%", delay:0.05, ease:Power3.easeOut, opacity:1});
});
$("#close-form").click(function(){
    TweenMax.to($("#form-wrapper"), 0.45, {opacity:0, top:"110%", ease:Power3.easeOut});
    TweenMax.to($iframeBg, 0.25, {opacity:0, delay:0.1});
    TweenMax.to($iframeBg, 0.01, {top:"120%", delay:0.45});
});

我有非 ie8 的上述代码，以及 ie8 下面的代码——它们看起来完全一样，只是补间中没有不透明度：

if(ie8){
    $(".button-wrap.enter-now").click(isMobile ?
        function(){
            window.location = 'form/form.html';
        }
        : function(){
            TweenMax.to($iframeBg, 0.35, {startAt:{top:0} });
            TweenMax.to($("#form-wrapper"), 0.45, { top:"8%", delay:0.05, ease:Power3.easeOut});
    });
    $("#close-form").click(function(){
        TweenMax.to($("#form-wrapper"), 0.45, {top:"110%", ease:Power3.easeOut});
        TweenMax.to($iframeBg, 0.25, { delay:0.1});
        TweenMax.to($iframeBg, 0.01, {top:"120%", delay:0.25});
    });
}

我只是想知道，如何将代码简化为一个？我什至不知道要搜索什么。非常感谢。

4

3 回答 3

0

只需在代码中查找模式，然后重新排列即可。例如，您有一个带有点击监听器的元素；做一次。单击后，您对移动设备有相同的检查；做一次。等等，所以，对于你来说，.button-wrap.enter-now你可以拥有一个类似这样的功能：

$(".button-wrap.enter-now").click(function(){
  if(isMobile){
    window.location = 'form/form.html';
  }else if(ie8){
    TweenMax.to($iframeBg, 0.35, {startAt:{top:0} });
    TweenMax.to($("#form-wrapper"), 0.45, { top:"8%", delay:0.05, ease:Power3.easeOut});
  }else{
    TweenMax.to($iframeBg, 0.35, {startAt:{top:0}, opacity:1 });
    TweenMax.to($("#form-wrapper"), 0.45, {top:"8%", delay:0.05, ease:Power3.easeOut, opacity:1});
  }
});

你也可以进一步结合这些TweenMax，但我想让它更简单，我希望你能明白要点。现在您应该也可以为您的#close-form点击处理程序执行相同的操作。

于 2013-06-20T01:47:58.610 回答
0

像这样，只需使用变量来保存对象并在检测到 IE8 时设置不透明度。

$(".button-wrap.enter-now").click(isMobile ?
    function(){
        window.location = 'form/form.html';
    }
    : function(){
        var attrA = {startAt:{top:0}};
        var attrB = {top:"8%", delay:0.05, ease:Power3.easeOut};
        if (ie8 /* In case ie8 is not working for you: $.browser.msie  && parseInt($.browser.version, 10) === 8*/) {
            attrA.opacity = 1;
            attrB.opacity = 1;
        }
        TweenMax.to($iframeBg, 0.35, attrA);
        TweenMax.to($("#form-wrapper"), 0.45, attrB);
});
$("#close-form").click(function(){
    var attrA = {top:"110%", ease:Power3.easeOut};
    var attrB = {delay:0.1};
    if (ie8) {
        attrA.opacity = 0;
        attrB.opacity = 0;
    }
    TweenMax.to($("#form-wrapper"), 0.45, attrA);
    TweenMax.to($iframeBg, 0.25, attrB);
    TweenMax.to($iframeBg, 0.01, {top:"120%", delay:0.45});
});
于 2013-06-20T01:50:50.367 回答
0

为什么不把不透明度封装在一个if-else声明中。

$(".button-wrap.enter-now").click(isMobile ? function(){
        window.location = 'form/form.html';
    }
    : function(){
        TweenMax.to($iframeBg, 0.35, {startAt:{top:0}, opacity:1 });
        TweenMax.to($("#form-wrapper"), 0.45, {top:"8%", delay:0.05, ease:Power3.easeOut, opacity:1});
});

$("#close-form").click(function(){
    TweenMax.to($("#form-wrapper"), 0.45, {opacity:0, top:"110%", ease:Power3.easeOut}); 
    if(ie8){
        TweenMax.to($iframeBg, 0.25, {delay:0.1});
    }else{
        TweenMax.to($iframeBg, 0.25, {opacity:0, delay:0.1});
    }
    TweenMax.to($iframeBg, 0.01, {top:"120%", delay:0.45});
});
于 2013-06-20T01:59:06.793 回答