Foros del Web » Programando para Internet » Javascript »

Perfeccionar codigo para hacerlo mas eficiente

Estas en el tema de Perfeccionar codigo para hacerlo mas eficiente en el foro de Javascript en Foros del Web. Hola. Vaya por delante que mis conocimientos de javascript y jquery son regulares. Tengo una pagina que al pulsar guardar, va al servidor, realiza operaciones, ...
  #1 (permalink)  
Antiguo 03/11/2020, 09:35
 
Fecha de Ingreso: mayo-2009
Mensajes: 741
Antigüedad: 11 años, 7 meses
Puntos: 6
Perfeccionar codigo para hacerlo mas eficiente

Hola.

Vaya por delante que mis conocimientos de javascript y jquery son regulares.

Tengo una pagina que al pulsar guardar, va al servidor, realiza operaciones, se trae los datos y despues hace esto:

Código Javascript:
Ver original
  1. $( 'html, body' ).animate({
  2.                 opacity: 0,
  3.             }, 1, function() {
  4.         $( 'html, body' ).animate({
  5.                 scrollTop : posicionar,
  6.                 behavior: 'smooth',
  7.             }, 1, function(){
  8.         $( 'html, body' ).animate({
  9.                 opacity: 1,
  10.             }, 1000)
  11.             })
  12.         });

La idea es que el scroll se situe donde el valor de la variable "posicionar" sin que se note con un efecto fade. Es decir, al entrar en la pagina, que ya haga el fade y que vuelva cuando esté posicionado. Así de esta forma el usuario solo ve que se le ha vuelto a posicionar donde pulsó guardar.

Este código está funcionando relativamente bien, pero en alguna ocasion se ve un poco como baja el cursor.

La idea es que algun experto como vosotros me de alguna idea de como se puede optimizar este trozo de código para que funcione perfecto.

Muchas gracias.

Un saludo.
  #2 (permalink)  
Antiguo 04/11/2020, 13:12
Avatar de Alexis88
Philosopher
 
Fecha de Ingreso: noviembre-2011
Ubicación: Tacna, Perú
Mensajes: 5.475
Antigüedad: 9 años, 2 meses
Puntos: 952
Respuesta: Perfeccionar codigo para hacerlo mas eficiente

Podrías obtener un resultado más pronto si directamente ocultas el contenido desde la hoja de estilos y en la función que se ejecuta al completarse el efecto en el método .animate() efectúas el cambio respectivo para que el contenido vuelva a ser visible; o bien puedes utilizar el método .scroll() para realizar el desplazamiento sin efectos de transición.

Código CSS:
Ver original
  1. body{
  2.     opacity: 0;
  3. }
  4.  
  5. .show{
  6.     opacity: 1;
  7. }

Código Javascript:
Ver original
  1. window.scroll(0, posicionar);
  2. document.body.className = "show";

__________________
«Juro por mi vida y mi amor por ella, que jamás viviré para el provecho de otro hombre, ni le pediré a otro hombre que viva para el mío».

Ayn Rand



La zona horaria es GMT -6. Ahora son las 09:11.