1

estoy tratando de seguir un tutorial en donde animan los elementos con el scroll.

El problema es como un conflicto con el plugin de motopress en este archivo:

wp-content\plugins\motopress-content-editor-lite\motopress-content-editor.php

que en las lineas 105 - 107 tienen esta variable: $pUrl que al eliminarla me funciona el script pero quita también algunas propiedades del motopress alguien sabe como puedo solucionar esto?

const target = document.querySelectorAll('[data-anime]');
const animationClass = 'animate';

function animeScroll() {
  const windowTop = window.pageYOffset;
  target.forEach(function(element) {
    if((windowTop) > element.offsetTop) {
        element.classList.add(animationClass);
      }
      console.log(element.offsetTop);
  })
}

  window.addEventListener('scroll', function() {
    animeScroll();
  })

el codigo css

.cont_all{
    display: flex;
}

.a{
    background: red;
    margin: 15px;
    height: 300px;
    width: 300px;
}

[data-anime] {
    opacity: 0;
    transition: .3s;
  }

  [data-anime="left"] {
    transform: translate3d(-50px, 0, 0);
  }

  [data-anime="right"] {
    transform: translate3d(50px, 0, 0);
  }

  [data-anime="top"] {
    transform: translate3d(0, -50px, 0);
  }

  [data-anime].animate {
    opacity: 1;
    transform: translate3d(0px, 0px, 0px);
  }

y en el worpress solo agrego el selector data-anime="left" dependiendo de donde quiero que salga la animacion

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.