Question

我有许多动态创建的元素，我想稍后对其进行动画处理。我知道动态元素可以通过以下方式引用：

$(document).on(event, selector, cb)

但是我不确定如何用动画实现它。这是我的代码，如果有帮助。 “ state.headings”和“ state.text”引用了动态元素

var state = {
  sm: () => {return $(window).width() < "576"},
  blocks: [
    $("#first-block"),
    $("#second-block")
  ],
  pairs: [
    $("#first-pair"),
  ],
  headings: [
    $("#first-heading"),
    $("#second-heading"),
  ],
  text: [
    $("#first-text"),
    $("#second-text"),
  ],
  watching: 0,
}

$(window).on("scroll", () => {
  if (state.sm()) {
    if (isInViewport(state.blocks[state.watching])) {
      if (state.headings[state.watching].css("right") !== "0px") {
        state.headings[state.watching].animate({
          right: "0px"
        })
        state.text[state.watching].animate({
          left: "0px"
        }, () => {
          if (state.watching < state.blocks.length -1){
            state.watching++ 
          }
        })
      }
    }
  } else {
    //handle animations for larger devices
  }
})

Answer 1

我可以通过将选择器设置为常规字符串并使用

来解决此问题

$(document.getElementById(selector)).animate()

但是我仍然很想知道jQuery是否提供了自己的解决方案。

使用Jquery动画化/引用动态元素

1 个答案: