|

Laboratorio: evitar el scroll en los textarea con jQuery

Una cosa que he visto en una web que estoy usando y que me ha gustado bastante es que el alto de los textarea se adapta al contenido para evitar que aparezca el scroll vertical.

En plan rapidito he hecho un script jQuery que realizaría esta función:

$(document).ready(function () {
$('textarea').keypress(function() {
var ta = $(this);
var fontSize = ta.css('font-size').replace('px', '')*1.3; // Le añado un ratio para que sea más eficiente
var taWidth = ta.width();
var taHeight = ta.height();
var content = ta.attr('value').split('\n');
var lines = content.length;
for (var i=0; i<content.length; i++) {
if (content[i].length * fontSize > taWidth) lines += parseInt(content[i].length * fontSize / taWidth);
}
var ratioHeight = taHeight / fontSize;
if (lines * fontSize > taHeight) ta.height((lines * fontSize)+150); // Le sumo 150 para darle un margen y que no se agrande constantemente
});
});

Sincronicar scrolls entre capas con jQuery

Interesante script que permite sincronizar scrolls en diferentes divs para que al mover uno el resto también se muevan

jQuery.fn.synchronizeScroll = function() {
var elements = this;
if (elements.length <= 1) return;
elements.scroll(
function() {
var left = $(this).scrollLeft();
var top = $(this).scrollTop();
elements.each(
function() {
if ($(this).scrollLeft() != left) $(this).scrollLeft(left);
if ($(this).scrollTop() != top) $(this).scrollTop(top);
});
});
}

Synchronizing Scrollbars using JQuery

Cargar contenido mediante el scroll usando jQuery

Un sencillo script realizado con jQuery que nos permite cargar contenido cuando llegamos al final del contenido mediante el scroll. Algo parecido os presenté hace ya tiempo, pero sin uso de librerías. En este caso, jQuery reduce el código para implementarlo.
Es importante recordar que el contenido importante no se debería cargar mediante Ajax, y si se hace así es necesario ofrecer una alternativa clásica.
Load Content While Scrolling With jQuery
Vía / Ajaxline