Saludos. Estoy haciendo, por aprendizaje, mi propia libreria de JS y me ha asaltado una duda después del siguiente error que me muestra la consola al tratar ciertos datos (el error sólo me lo muetra al usar el debbuger y poner un punto de ruptura en la línea del error).
The ‘content’ attribute of Window objects is deprecated. Please use ‘window.top’ instead. En concreto, este error me sale en una sentencia en la que cambio los estilos css;
element.style.transition = 'all 1s ease-in-out'; En el debbuger he encontrado que después de esta sentencia el estilo se queda como 'all 1s ease-in-out 0s'.
¿Donde estoy haciendo uso del content y como puedo arreglarlo?¿Qué estoy haciendo mal?
Dejo aquí el script completo listo para funcionar;
(function(window,document) { var userIN = function(window) { var lib = { fullSlide: function(elementID,direction) { //break point for param != string if ((typeof elementID != 'string') || (typeof direction != 'string')) return; //DOM element on focus var element = document.getElementById(elementID); //transition property element.style.transition = 'all 1s ease-in-out'; //transition according to parameter switch (direction) { case 'top': element.style.top = '-100vh'; break; case 'right': element.style.left = '100vw'; break; case 'bottom': element.style.top = '100vh'; break; case 'left': element.style.left = '-100vw'; break; default: return; } //remove transition property var transition = setTimeout(function() { element.style.transition = ''; },1000); } } return lib; } if (typeof window.userIN === "undefined") { window.userIN = userIN(); } })(window,document); var b = document.getElementById('btn'); var d1 = document.getElementById('div1'); var d2 = document.getElementById('div2'); b.onclick = function() { userIN.fullSlide('div2','right'); }body {margin:0;padding:0;height:100vh;width:100vw;overflow: hidden} div {width: 100%;height: 100%} #div1 {background: green;position: absolute;z-index: 2} #div2 {background: yellow;position: absolute;z-index: 3} button {position: fixed; top: 100px; left:100px;z-index: 4}<div id="div1"></div> <div id="div2"></div> <button id="btn">CLICK</button>
