Skip to main content
El link estaba mal
Origen Enlace
Manuco Bianco
  • 1.2k
  • 9
  • 15
  • 23

Asi como dices, hay que guardar la variable de la posición anterior, he ir actualizándola, cada vez que pide el valor.

Notas:

  • Es necesario, iniciarlizar la variable anterior, y declararla fuera de la función.
  • Para la respuesta que te di, no use jquery como tu, si no, un evento de html: onmousemoveonmousemove

var anterior = 0;
var img = document.getElementById("img");
function aplicarOpacidad(event){
  var x = event.pageX - img.offsetLeft;
  
  img.style.opacity = x/img.offsetWidth;

  anterior = x;
};
#img{
  width:300px;
  height:300px;
  display:block;
  margin:auto;
}
<img id="img" src="https://dummyimage.com/1080x1024/000/fff" onmousemove="aplicarOpacidad(event);"
/>

Asi como dices, hay que guardar la variable de la posición anterior, he ir actualizándola, cada vez que pide el valor.

Notas:

  • Es necesario, iniciarlizar la variable anterior, y declararla fuera de la función.
  • Para la respuesta que te di, no use jquery como tu, si no, un evento de html: onmousemove

var anterior = 0;
var img = document.getElementById("img");
function aplicarOpacidad(event){
  var x = event.pageX - img.offsetLeft;
  
  img.style.opacity = x/img.offsetWidth;

  anterior = x;
};
#img{
  width:300px;
  height:300px;
  display:block;
  margin:auto;
}
<img id="img" src="https://dummyimage.com/1080x1024/000/fff" onmousemove="aplicarOpacidad(event);"
/>

Asi como dices, hay que guardar la variable de la posición anterior, he ir actualizándola, cada vez que pide el valor.

Notas:

  • Es necesario, iniciarlizar la variable anterior, y declararla fuera de la función.
  • Para la respuesta que te di, no use jquery como tu, si no, un evento de html: onmousemove

var anterior = 0;
var img = document.getElementById("img");
function aplicarOpacidad(event){
  var x = event.pageX - img.offsetLeft;
  
  img.style.opacity = x/img.offsetWidth;

  anterior = x;
};
#img{
  width:300px;
  height:300px;
  display:block;
  margin:auto;
}
<img id="img" src="https://dummyimage.com/1080x1024/000/fff" onmousemove="aplicarOpacidad(event);"
/>

se eliminaron 51 caracteres en el cuerpo
Origen Enlace
Manuco Bianco
  • 1.2k
  • 9
  • 15
  • 23

Asi como dices, hay que guardar la variable de la posición anterior, he ir actualizándola, cada vez que pide el valor.

Notas:

  • Es necesario, iniciarlizar la variable anterior, y declararla fuera de la función.
  • Para la respuesta que te di, no use jquery como tu, si no, un evento de html: onmousemove

var anterior = 0;
var img = document.getElementById("img");
function aplicarOpacidad(event){
  var x = event.pageX - img.offsetLeft;
  
  img.style.opacity = x/100;img.offsetWidth;

  anterior = x;
};
#img{
  width:300px;
  height:300px;
  border:solid 1px black;
  display:block;
  margin:auto;
}
<img id="img" src="https://dummyimage.com/1080x1024/000/fff" onmousemove="aplicarOpacidad(event);"
/>

Asi como dices, hay que guardar la variable de la posición anterior, he ir actualizándola, cada vez que pide el valor.

Notas:

  • Es necesario, iniciarlizar la variable anterior, y declararla fuera de la función.
  • Para la respuesta que te di, no use jquery como tu, si no, un evento de html: onmousemove

var anterior = 0;
var img = document.getElementById("img");
function aplicarOpacidad(event){
  var x = event.pageX - img.offsetLeft;
  
  img.style.opacity = x/100;

  anterior = x;
};
#img{
  width:300px;
  height:300px;
  border:solid 1px black;
  display:block;
  margin:auto;
}
<img id="img" src="https://dummyimage.com/1080x1024/000/fff" onmousemove="aplicarOpacidad(event);"
/>

Asi como dices, hay que guardar la variable de la posición anterior, he ir actualizándola, cada vez que pide el valor.

Notas:

  • Es necesario, iniciarlizar la variable anterior, y declararla fuera de la función.
  • Para la respuesta que te di, no use jquery como tu, si no, un evento de html: onmousemove

var anterior = 0;
var img = document.getElementById("img");
function aplicarOpacidad(event){
  var x = event.pageX - img.offsetLeft;
  
  img.style.opacity = x/img.offsetWidth;

  anterior = x;
};
#img{
  width:300px;
  height:300px;
  display:block;
  margin:auto;
}
<img id="img" src="https://dummyimage.com/1080x1024/000/fff" onmousemove="aplicarOpacidad(event);"
/>

se eliminaron 51 caracteres en el cuerpo
Origen Enlace
Manuco Bianco
  • 1.2k
  • 9
  • 15
  • 23

Asi como dices, hay que guardar la variable de la posición anterior, he ir actualizándola, cada vez que pide el valor.

Notas:

  • Es necesario, iniciarlizar la variable anterior, y declararla fuera de la función.
  • Para la respuesta que te di, no use jquery como tu, si no, un evento de html: onmousemove

var anterior = 0;
var img = document.getElementById("img");
function aplicarOpacidad(event){
  var x = event.pageX - img.offsetLeft;
 
  if (x>anterior) {
    consoleimg.log('Derecha');
  }else if(x<anterior){
    consolestyle.log('Izquierda');
opacity = }x/100;

  anterior = x;
};
#img{
  width:100px;300px;
  height:100px;300px;
  border:solid 1px black;
  display:block;
  margin:auto;
}
<div<img id="img" src="https://dummyimage.com/1080x1024/000/fff" onmousemove="aplicarOpacidad(event);">
;"
</div>>

Asi como dices, hay que guardar la variable de la posición anterior, he ir actualizándola, cada vez que pide el valor.

Notas:

  • Es necesario, iniciarlizar la variable anterior, y declararla fuera de la función.
  • Para la respuesta que te di, no use jquery como tu, si no, un evento de html: onmousemove

var anterior = 0;
var img = document.getElementById("img");
function aplicarOpacidad(event){
  var x = event.pageX - img.offsetLeft;
 
  if (x>anterior) {
    console.log('Derecha');
  }else if(x<anterior){
    console.log('Izquierda');
  }
  anterior = x;
};
#img{
  width:100px;
  height:100px;
  border:solid 1px black;
  display:block;
  margin:auto;
}
<div id="img" onmousemove="aplicarOpacidad(event);">

</div>

Asi como dices, hay que guardar la variable de la posición anterior, he ir actualizándola, cada vez que pide el valor.

Notas:

  • Es necesario, iniciarlizar la variable anterior, y declararla fuera de la función.
  • Para la respuesta que te di, no use jquery como tu, si no, un evento de html: onmousemove

var anterior = 0;
var img = document.getElementById("img");
function aplicarOpacidad(event){
  var x = event.pageX - img.offsetLeft;
  
  img.style.opacity = x/100;

  anterior = x;
};
#img{
  width:300px;
  height:300px;
  border:solid 1px black;
  display:block;
  margin:auto;
}
<img id="img" src="https://dummyimage.com/1080x1024/000/fff" onmousemove="aplicarOpacidad(event);"
/>

Origen Enlace
Manuco Bianco
  • 1.2k
  • 9
  • 15
  • 23
Loading