Scroll div, en div contenedor con alto variable

[koruitch]

Hola gente, necesito ayuda de verdad, no soy capaz a resolver este problema y llevo tiempo intentando solucionarlo.

Tengo una web que la izquierda está el contenido del articulo y a la derecha datos del autor y anuncios.

Quiero poner que un div se mueva solo cuando la parte de arriba del navegador la toque. Y que se pare al llegar al final del div contenedor.

Encontre alguno que otro sistema pero ninguno que encontre hace lo que realmente quiero.

Encontre uno con css solamente pero el div contenedor tiene alto variable dependiendo del contenido del articulo, eche dias con ese y no fui capaz de el. No di echo que me funcionara con un alto variable.

Luego encontre otro en javascript que lo que hace es que se mueva el div y al llegar a otro div (previamente estipulado) lo oculta, (bueno vuelve a su posiccion original). Este sistema lo pude poner sin parar, ya que al poner un div contiguo por ejemplo, lo oculta donde le parece, mas o menos creo que se porque es, es dificil de explicar con palabras, El articulo tiene un div, y el sidebar tiene otro, si pongo un div del footer por ejemplo, en el codigo el footer está contiguo al div fixed, mas o menos, por eso lo oculta donde le parece.


Busco exactamente algo como el scroll que usa taringa en los posts a su derecha.
Algo que me calcule el alto del div contenedor y que solo se desplace en ese espacio. Creo que sería la forma correcta de hacerlo.

Estube mirando y creo que hay que usar algo de parse, pero no tengo ni idea ya en estos temas tan avanzados. No se si jquery.

Haber si me podeis recomendar alguno, al menos decirme donde puedo buscarlo. Llevo buscado mucho y no doy con un codigo que me aga esto. Luego yo ya me buscare la vida para integrarlo o lo que sea, pero necesito ayuda. Gracias.

[Gustavo72]

Creo que con jquery podés hacerlo.
$('div#miDiv').height(); //Para calcular la altura de un div de id="miDiv".
$('div#miDiv').outerHeight(true); //Para calcular la altura con paddings, bordes, márgenes incluidos.

$('document').scrollTop(); //Para calcular la posición del scroll en la página.

var o=$('div#miDiv').offset(); o.top: te da la posición y absoluta del div.
var p=$('div#miDiv').position(); p.top: te da la posición y relativa del div respecto de su contenedor.

$('div#miDiv').animate({top: parseInt(x, 10)+'px'}, 1000); //Mueve el div a posición top x píxeles en 1000 milisegundos.

Saludos!

[koruitch]

Iniciado por Gustavo72

Creo que con jquery podés hacerlo.
$('div#miDiv').height(); //Para calcular la altura de un div de id="miDiv".
$('div#miDiv').outerHeight(true); //Para calcular la altura con paddings, bordes, márgenes incluidos.

$('document').scrollTop(); //Para calcular la posición del scroll en la página.

var o=$('div#miDiv').offset(); o.top: te da la posición y absoluta del div.
var p=$('div#miDiv').position(); p.top: te da la posición y relativa del div respecto de su contenedor.

$('div#miDiv').animate({top: parseInt(x, 10)+'px'}, 1000); //Mueve el div a posición top x píxeles en 1000 milisegundos.

Saludos!

Buah oO, Intentaré buscar algo con esos codigos porque si tengo que montar yo el codigo creo que llegaré a la tercera edad. Igual creo que acabaré antes si me saco la carrera de informatica que intentar montarlo con mis conocimientos XD . Gracias, ahora no puedo, pero luego realizare unas busquedas con esa informacion. Seguro que me sirve de mucho para solucionar el problema. Muchas gracias.

[koruitch]

Haber si alguien me podria decir mas pense que podria buscarme la vida, pero no encuentro nada sobre el tema. Ayuda por favor.

[koruitch]

Pude conseguir otro codigo para esto. Haber que me falta porque no logro que me funcione.

Código Javascript:

(function(a){a.fn.extend({scrollFixed:function(b){var d=a.extend({topSpacing:0,parent:null},b);var f=a(window),e=a(document);return this.each(function(){var h=a(this),o=d.parent?d.parent:h.parent(),k=a("<div></div>"),j=false,p=h.height(),n=h.offset().top,l=o.height(),m=o.offset().top;k.css("height",p);k.insertAfter(h);h.css("position","absolute");
 
function g(){if(e.scrollTop()+d.topSpacing>n&&l+m-e.scrollTop()-p>0){
    if(!j){j=true;h.css({position:"fixed",top:d.topSpacing})}
    }else{
    if(j){j=false;if(l+m-e.scrollTop()-p>0){h.css({position:"absolute",top:""})
    }else{
    h.css({position:"absolute",top:l+m-p+d.topSpacing})}}}}f.on("scroll",g);setInterval
 
(function(){var q=false;if(h.height()!=p){p=h.height();
            k.css("height",p);q=true}if(k.offset().top!=n){n=k.offset().top;
            q=true}if(o.height()!=l){l=o.height();q=true}
            if(o.offset().top!=n){m=o.offset().top;q=true}
            if(q){g()}},1000)})}})})(jQuery);
            $(".fixme").scrollFixed({topSpacing:-15,parent:$($(".fixme").data("parent"))});
 

Y luego en el div uso:

Código HTML:

<div class="fixme" data-parent="#bg_post"> 

No logro que me funcione el style ¿que se lo que me falta? ¿o que ago mal?

[koruitch]

¿nadie me puede ayudar con esto?