Foros del Web » Creando para Internet » Diseño web »

Mi sidebar "sticky" no me permite ver todo el contenido de la columna

Estas en el tema de Mi sidebar "sticky" no me permite ver todo el contenido de la columna en el foro de Diseño web en Foros del Web. Hola muchas gracias por leer y brindarme su apoyo. Como pueden ver en el link https://www.ayaestabilizadores.com/Proyecto/ mi plataforma costa de cabezal (donde dice logo) y ...
  #1 (permalink)  
Antiguo 15/04/2019, 16:03
Avatar de WebSalvador  
Fecha de Ingreso: agosto-2011
Ubicación: Lima - Perú
Mensajes: 166
Antigüedad: 8 años, 1 mes
Puntos: 2
Mi sidebar "sticky" no me permite ver todo el contenido de la columna

Hola muchas gracias por leer y brindarme su apoyo.

Como pueden ver en el link https://www.ayaestabilizadores.com/Proyecto/ mi plataforma costa de cabezal (donde dice logo) y debajo el cuerpo y la barra lateral

la barra lateral es una columna "pegajoso" o "sticky" el cual lo hice con javascript y segun utilizamos la barra d edesplazamiento vertical permanece en posicion 0 del top, pero no logro que se vea todo el contenido de esa barra lateral que tiene 3 fotos.

¿Como puedo hacer para que se me permita ver todo el contenido?

Este es el codigo que emplee:
Código PHP:
$(document).ready(function(){
    var 
altura = $('.contenedor-publicidad').offset().top;
    
    $(
window).on('scroll', function(){
        if ( $(
window).scrollTop() > altura ){
            $(
'.contenedor-publicidad').addClass('contenedor-publicidad-fijo');
        } else {
            $(
'.contenedor-publicidad').removeClass('contenedor-publicidad-fijo');
        }
    });
 
}); 
Código PHP:
aside.contenedor-publicidad{positionrelative;}
aside.publicidad{positionfixedtop:0right0}
section.publicidad article{margin-bottom20px;}
aside.contenedor-publicidad-fijo{
    
position:fixed;
    
z-index:1000;
    
top:0;
    
right0;
    
width:100%;
    }
section.publicidad article {margin-bottom8px;} 
En este enlace se observa perfectamente lo que deseo hacer: https://www.laboratorioslabet.com.pe...eche-mas-plus/ como lo pueden apreciar se puede ver perfectamente el contenido de de ambas columnas, y el top de la columna dos no es fija sino que cambia segun la circunstancias.
__________________
Studio Web Salvador http://www.acuarel.pe/

Última edición por WebSalvador; 15/04/2019 a las 16:12
  #2 (permalink)  
Antiguo 17/04/2019, 18:02
Avatar de WebSalvador  
Fecha de Ingreso: agosto-2011
Ubicación: Lima - Perú
Mensajes: 166
Antigüedad: 8 años, 1 mes
Puntos: 2
Respuesta: Mi sidebar "sticky" no me permite ver todo el contenido de la columna

Hola ¿se me entendio? es muy dificil de hacer?
__________________
Studio Web Salvador http://www.acuarel.pe/
  #3 (permalink)  
Antiguo 19/04/2019, 08:50
Avatar de DragonX
Colaborador
 
Fecha de Ingreso: mayo-2002
Ubicación: Funkyland
Mensajes: 8.412
Antigüedad: 17 años, 3 meses
Puntos: 175
Respuesta: Mi sidebar "sticky" no me permite ver todo el contenido de la columna

lo que te tira todo abajo es el alto de las img, si a esas imgs las haces menos altas te entran todas.
o que tengan 100% de height y un width auto. entonces cada img se acomodaria a su respectivo contenedor.
Slds.-
__________________
Desarrollos dosLotos
Calendario Maya, Meditación, Osho
  #4 (permalink)  
Antiguo 19/04/2019, 10:32
Avatar de ArturoGallegos
Moderador
 
Fecha de Ingreso: febrero-2008
Ubicación: Morelia, México
Mensajes: 6.462
Antigüedad: 11 años, 6 meses
Puntos: 1072
Respuesta: Mi sidebar "sticky" no me permite ver todo el contenido de la columna

El problema mas que el contenido del sticky, es el hecho de que no todas las pantallas tienen el mismo alto y no es muy facil o vistoso el ajustar un sticky vertical., el hacer menos altas las imágenes no siempre sera la solución en el caso del responsive., aunque en definitiva ayudaría en las PC.

Una alternativa muy fea seria dejar el scroll en automático para que te aparezca un scroll sobre el sticky, aunque siendo publicidad dudo que muchos se molesten en desplazarlo.

En lo personal los sticky deben ir en horizontal, afecta menos al diseño cuando tienes que ajustar el alto o cantidad de elementos.



La zona horaria es GMT -6. Ahora son las 13:44.