Question

一直困扰我一段时间的人。我如何将这三组代码组合在一起？

$(".fly-out-menu").toggle(
      function () {
        $('#page').animate({left: 250}, 'fast'); },
      function () {
        $('#page').animate({left: 0}, 'fast'); }
);
$(".fly-out-menu").toggle(
      function () {
        $('.sticky-container').animate({left: 250}, 'fast'); },
      function () {
        $('.sticky-container').animate({left: 0}, 'fast'); }
);
$(".fly-out-menu").toggle(
      function () {
        $('body').css('position','fixed') },
      function () {
        $('body').css('position','static') }
);

谢谢， [R

Answer 1

喜欢那个？

$(".fly-out-menu").toggle(
    function(){
        $('#page, .sticky-container').animate({left: 250}, 'fast');
        $('body').css('position','fixed');
    },
    function(){
        $('#page, .sticky-container').animate({left: 0}, 'fast');
        $('body').css('position','static');
    }
);

正如@undefined所指出的，此事件现已弃用自己处理这个问题的一种方法是：

$(".fly-out-menu").on("click", function(){
    var t = $(this);
    if(!t.data("alreadyclicked")){
        t.data("alreadyclicked", true);
        $('#page, .sticky-container').animate({left: 250}, 'fast');
        $('body').css('position','fixed');
    } else {
        t.data("alreadyclicked", false);
        $('#page, .sticky-container').animate({left: 0}, 'fast');
        $('body').css('position','static');
    }
});

Answer 2

你的意思是这样吗？

$(".fly-out-menu").toggle(
function () {
    $('#page').animate({left: 250}, 'fast'); 
    $('.sticky-container').animate({left: 250}, 'fast');
    $('body').css('position','fixed');
},
function () {
    $('#page').animate({left: 0}, 'fast');
    $('.sticky-container').animate({left: 0}, 'fast');
    $('body').css('position','static');
}
);

或者像这样：

$(".fly-out-menu").toggle(
function () {
    $('#page, .sticky-container').animate({left: 250}, 'fast');
    $('body').css('position','fixed');
},
function () {
    $('#page, .sticky-container').animate({left: 0}, 'fast');
    $('body').css('position','static');
}
);

jQuery - 结合功能

2 个答案: