Eu tenho duas div
de mesma altura, mas com conteúdos distintos. E quando eu fizer o scroll em uma, eu queria que a outra acompanhasse na mesma (ou ao menos próxima da mesma) posição.
O problema é que os conteúdos delas não possuem o mesmo tamanho, e consequentemente o tamanho da barra de rolagem acaba ficando diferente entre elas. Mas mesmo com a diferença de tamanho eu gostaria de fazer o scroll da segunda acompanhar o da primeira, de forma que se eu rolasse até o final da primeira div
a segunda também deveria ir para o final, mesmo sendo de conteúdo maior.
Não sei se consegui ser claro, mas aqui segue um exemplo do que eu pretendo fazer.
(function () {
var target = $("#target")[0]; // <== Getting raw element
$("#source").scroll(function () {
target.scrollTop = this.scrollTop;
target.scrollLeft = this.scrollLeft;
});
})();
Eu utilizei uma solução encontrada nesta resposta, mas o problema é justamente que o scroll da segunda só vai até onde o da primeira termina, ou seja, ele não se comporta da forma devida.
Existe alguma forma de criar um scroll-espelho "inteligente"?