можно еще так (без id, заметь)
function onMouseEnterLeave( e ) {
var to = { mouseenter: 0.1, mouseleave: 1 };
if( $.data(this, 'isRunning') ) {
$.data( this, 'last', e.type );
return;
}
$.data( this, 'isRunning', true );
$.data( this, 'last', null );
var type = e.type;
$(this).fadeTo(500, to[ e.type ], function() {
var last = $.data( this, 'last');
if( last && (type != last) ) {
var img = this;
setTimeout( function() {
$(img).trigger( last );
}, 0 );
}
$.data( this, 'isRunning', false );
});
}
а можно так
$("a img").bind("mouseenter", function() {
$(this).stop().fadeTo(500, 0.1);
});
$("a img").bind("mouseleave", function() {
$(this).stop().fadeTo(500, 1);
});
или аналог mootools-варианта
$("a img").bind("mouseenter", function() {
$(this).stop().fadeTo(0, 1).fadeTo(500, 0.1);
});
$("a img").bind("mouseleave", function() {
$(this).stop().fadeTo(0, 0.1).fadeTo(500, 1);
});
и собственно вопрос: "почему такая разница в количестве кода?" Но в любом случае сравнивать фреймворки надо не по количеству кода одной задачи
Под задуматься я подразумевал, что именно надо: 1) анимации выполняются все и до конца, 2) пропускаются промежуточные анимации, 3) очередное событие прерывает текущую анимацию, 4) очередное событие прерывает текущую анимацию и начинает новую с ее "начала" (mootools-вариант)