Quantcast
Channel: Adobe Community : Discussion List - Foro en español
Viewing all articles
Browse latest Browse all 8025

Hola. Estoy creando una pagina interactiva en Adobe Edge Animate CC, y tengo un inconveniente. Hice un header interactivo y busco la manera de que este quede fijo en la parte superior del navegador.

$
0
0

Ya intente varias maneras de hacerlo pero ninguna funciona bien de manera responsive.

la primera opción que utilice, fue fijar el símbolo con position:fixed así:

 

sym.$("menu").css("position","fixed");


Este funciona pero solo deshabilitando la función responsive que viene por defecto en el Edge en la parte izquierda de la interfaz.

1.PNG

Como no me funciona con responsive, no me sirve.


La segunda opción que utilice fue hacerlo por medio de jQuery, y lo hice así;


$(window).scroll(function(){

 

 

      var element = sym.$("Menu");

      element.stop().animate({"marginTop": ($(window).scrollTop() + "px")}, "fast" );

});

 

Esta ultima funciona mucho mejor que la primera, pero tiene un detalle que imposibilita su uso, y es el hecho de que cuando escalo el navegador, aunque también se escala el símbolo, los valores de tamaño cambian haciendo que cuando hago scroll hacia abajo, el símbolo tenga un comportamiento extraño y haya un delay que me genera un espaciado indeseado entre la parte superior del navegador y el menú.

 

2.PNG3.PNG4.PNG

 

Quisiera saber si hay alguna manera de solucionar este inconveniente.

Yo había pensado en programar una opción que me reinicie los valores de scrolling o de tamaño de los elementos para que con cada tamaño de navegador los valores se acomoden al tamaño y no me genere ese delay. ya que en el tamaño por defecto de la animación, funciona a la perfección.

5.PNG

No se si me puedan ayudar con esta opción que les digo o con alguna otra que me ayude a solucionarlo.

de antemano muchísimas gracias.


Viewing all articles
Browse latest Browse all 8025

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>