Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: Beginner Web en 4 Abril 2020, 17:00 pm



Título: efecto al bajar scroll de una pagina
Publicado por: Beginner Web en 4 Abril 2020, 17:00 pm
hola, como hago este efecto que al bajar con el scroll el hedear siga visible  :huh:

http://www.titaves.com.ar/quienes-somos/ (http://www.titaves.com.ar/quienes-somos/)


Título: Re: efecto al bajar scroll de una pagina
Publicado por: EdePC en 4 Abril 2020, 17:31 pm
MiriadaX: Desarrollo en HTML5, CSS y javascript de Apps Web, Android
--------------------------------------------------------------------------------
https://miriadax.net/web/desarrollo-en-html5-css-y-javascript-de-apps-web-android-ios-8-ed- (Click en registrarse, es gratis)

Modulo 2: Estructura HTML5/CSS3 para multipantalla y objetos multimedia

Tema 0. Transparencias y ejemplos del módulo
http://vishub.org/excursions/2209.full
https://miriadax.net/documents/99047200/99047742/Transparencias_mod2.zip
https://miriadax.net/documents/99047200/99047742/Materiales_mod2.zip

Tema 2. HTML/CSS: Estructura CSS (Float, Position, Flex, Grid)

uvJnJcWP1E8

- En el Módulo 1, tema 4 habla sobre como utilizar el Navegador web (chrome en este caso) para inspeccionar elementos web y ver sus estilos https://youtu.be/8d0xfVHS5CM, por ejemplo en la página que comentas tiene el estilo:

Código
  1. #main-nav.fixed {
  2.    position: fixed;
  3.    top: 0;
  4. }

- Deberías seguir el curso, por lo menos para conocer posibilidades HTML, CSS y javascript


Título: Re: efecto al bajar scroll de una pagina
Publicado por: @XSStringManolo en 4 Abril 2020, 18:33 pm
Puedes hacerlo de varias formas. Las más sencillas son la comentada por el compañero de aplicar css al elemento en cuestión modificando su position. fixed o absolute suelen ser las que te sirven para esto.

Otra opción es en vez de hacer el fijo es hacer el resto de la página móvil.

Un ejemplo fácil es un div donde le pongas el overflow le pongas un tamaño máximo. Busca por overflow-x overflow-y css en google. Así lo único que se mueve es el contenido del div. Quien dive div dice <main><nav><aside><section><textarea><footer> o el tag que te de la gana.