Ver Mensaje Individual
  #1 (permalink)  
Antiguo 09/10/2014, 18:18
Avatar de iconogt
iconogt
 
Fecha de Ingreso: septiembre-2004
Ubicación: Guatemala
Mensajes: 576
Antigüedad: 19 años, 7 meses
Puntos: 4
Sidebar con posición fixed

Que tal amigos(as), el pequeño problemita que tengo es que con javascript en el evento scroll el navegador asigno una clase a un sidebar, el cliente solicita que el sidebar siempre use el 100% del alto de su contenedor, eso me funciona perfectamente ahora el problemita es si ven la pagina en una resolución de 1024 aparece el scroll, (el máximo del contenedor es de 1260px).

Aquí pueden ver que es lo que pasa.



Lo que necesito es que la div o sidebar no se monte sobre el contenido de la derecha al hacer scroll horizontal.

Aquí un ejemplo de código que estoy usando.

Código Javascript:
Ver original
  1. var windowHeight = $(window).height();
  2.             var sidebarHeight = (windowHeight - 83 - 35);
  3.  
  4.             $(".pane-article-page-sidebars-panel-pane-1 .view-article-page-sidebars").css("height", sidebarHeight);
  5.             $(".panel-3col .panel-col-first").css("height", sidebarHeight);
  6.             setTimeout(function() {
  7.                
  8.                 var totalHeightBranding = $(".region-branding").height();
  9.                 var totalHeightScoreboard = $(".region-scoreboard").height();
  10.                 var message = $("#page #messages").height();
  11.                 var totalMessage = 0;
  12.                 if (message > 0) {
  13.                     totalMessage = message + 20;
  14.                 }
  15.                 var totalHeight = (totalHeightBranding + 7) + totalHeightScoreboard + totalMessage;
  16.                 var totalHeader = $("#page #header").height();
  17.                 $(window).scroll(function(event) {
  18.  
  19.                     var y = $(this).scrollTop();
  20.                     if (y > (totalHeight)) {
  21.                         $(".panel-col-first .inside").addClass("fixed");
  22.                     } else {
  23.                         $(".panel-col-first .inside").removeClass("fixed");
  24.                     }
  25.  
  26.                     var marginContent = 244;
  27.                     if ($(window).scrollTop() + $(window).height() > $(document).height() - marginContent) {
  28.                         $(".panel-col-first .inside").removeClass("fixed").addClass("fixed-bottom");
  29.                     } else {
  30.                         $(".panel-col-first .inside").removeClass("fixed-bottom");
  31.                     }
  32.                 });
  33.                 $(this).scroll();
  34.  
  35.             }, 2000);

Espero respuestas,
Gracias de antemano
__________________
_______
Jorge Rojas.