Question

以下函数使用import java.util.*; import java.lang.*; import java.io.*; class Ideone { public static void main (String[] args) throws java.lang.Exception { BufferedReader br=new BufferedReader(new InputStreamReader(System.in)); int t; t=Integer.parseInt(br.readLine()); while((t--)!=0) { int N,i,j; N=Integer.parseInt(br.readLine()); int c []={0,0,0,0,0,0,0,0}; String arr [] ={"TTT","TTH","THT","THH","HTT","HTH","HHT","HHH"}; String str,str1; N=Integer.parseInt(br.readLine()); str=br.readLine(); for(i=0;i<=37;i++) { str1=""; str1=str.substring(i,i+3); for(j=0;j<8;j++) { if(str1.equals(arr[j])) { c[j]++; break; } } } System.out.print(N); for(i=0;i<8;i++) System.out.print(" "+c[i]); System.out.println(); } } }参数（切换）使用jQuery滑动元素：

options

我想添加一个名为// options slideRight: { direction: 'right', startValue: '0', endValue: '100px' }, // function function(slide) { const $el = $(this.el) $el.click(() => { if ($el.parent().css(slide.direction) === slide.startValue) { $el.parent().animate({ [slide.direction]: slide.endValue }, 200) } else { $el.parent().animate({ [slide.direction]: slide.startValue }, 200) } }) }的第四个选项，它将使另一个元素成为移动的镜像。

但为此，我需要相对于当前位置移动元素。我怎么能做到这一点？

（注意：元素的mirror设置为position。）

Answer 1

检查这是否有效。我添加了第4个选项mirror，然后给出与第一个元素相同的动画。不确定手柄是否正确，因为我没有完整的标记。

// options
slideRight: {
  direction: 'right',
  startValue: '0',
  endValue: '100px',
  mirror: '#mirrorElement'
},

// function
function(slide) {
  const $el = $(this.el)
  $el.click(() => {
    if ($el.parent().css(slide.direction) === slide.startValue) {
      $el.parent().animate({
        [slide.direction]: slide.endValue
      }, 200);
      $(slide.mirror).animate({
        [slide.direction]: slide.endValue
      }, 200);
    } else {
      $el.parent().animate({
        [slide.direction]: slide.startValue
      }, 200)
      $(slide.mirror).animate({
        [slide.direction]: slide.startValue
      }, 200);
    }
  })
}

Answer 2

我的答案与目前发布的答案略有不同，但应该作为您想要的起点。我使用transform进行相对定位，因为如果您已将某个元素定位在top left，transform: translate将相对于其固定的当前位置移动您的项目。我认为动画转换也有额外的性能优势。我会调查一下。

根据（不正确的我确定）假设在演示中修改你的代码：

const someObject = {    

    // function
    slide: function (slide) {
      const $el = $(slide.el)
      $el.click(() => {
        if (slide.slideRight.direction === 'right') {

            $el.parent().animate({transform: 'translateX(' + slide.slideRight.endValue + 'px)'}, {
                duration: 200,
                step: function (now, fn) {
                    fn.start = $el.hasClass('in') ? slide.slideRight.endValue : slide.slideRight.startValue;
                    fn.end = $el.hasClass('in') ? slide.slideRight.startValue : slide.slideRight.endValue;
                    $el.parent().css({transform: 'translateX(' + now + 'px)'});

                    if (now === fn.end) {
                        $el.toggleClass('in');
                    }
                }
            })

        } else {
          // other stuff
        }
      })
    }

}

someObject.slide({
    el: '.position-me',
    slideRight: {
        direction: 'right',
        startValue: 0,
        endValue: 100,
        mirror: '.position-me-parent-mirror'
    }
})

<强> jsfiddle demo

Answer 3

将参数传递给.animate()时，您可以设置right: "-=50px"，以便将元素50px滑动到其当前right值的右侧。

这样的东西会使两个元素相对于当前位置移动相同的数量：

function slide(startValue, endValue) {
    var change = endValue-startValue;
    $("#one").animate({right:"-="+change+"px"}, 200);
    $("#two").animate({right:"-="+change+"px"}, 200)  
}

slide(0,50)

这是一个工作小提琴：https://jsfiddle.net/uLv1mz2u/

这是你在找什么？

使用jQuery相对于其位置滑动元素

3 个答案: