Анимация td с помощью jquery

Я пытаюсь оживить непрозрачность td с помощью jquery. Когда нажимается один td, я хочу анимировать любые td и исчезать в td, на который был нажат.Анимация td с помощью jquery

Я получаю странную проблему с мерцанием:

http://jsfiddle.net/s4gtp/

ТД будучи нажал на выцветает, но затем быстро выцветает и снова. Я проверил firebug, и событие запускается только один раз. Я пробовал тот же код с неупорядоченным списком, и все работает так, как ожидалось.

Любые идеи, почему это может произойти?

источник

2012-05-02 Mike Rifgin

ваш Jsfiddle работает как на хром, так и на IE для меня – jazzytomato

Я не могу помочь, но я знаю, что анимированные таблицы и ячейки таблицы являются *кошмар*. Если вы можете изменить это, чтобы использовать divs или список, это будет проще в долгосрочной перспективе. –

Попробуйте добавить в .not($(this)) к первой анимации:

$('tr td').click(function() { 
    var i = $(this).index(); 
    $('tr td').not($(this)).animate({'opacity': '0.1'}); 
    $('tr td.item' + i).animate({'opacity': "1"}); 
});

Кроме того, необходимо указать border-collapse:separate; в вашем CSS для таблицы. Это позволит решить эту проблему вы имеете в Firefox:

Вот обновленный jsFiddle для вас>http://jsfiddle.net/s4gtp/4/

Как и другие комментаторы заявляли, хотя, я не видел ни одного «мерцающий», поэтому я полагаю, вы имеете в виду, что щелкнутый элемент исчезает, а затем исчезает ...

источник

2012-05-02 10:26:07 BenM

Пробовал это, а также: не селектор, это не устраняет проблему. – Armatus

Кажется, что это особая проблема Firefox - обновленная скрипка по-прежнему делает то же самое для меня –

Извините, я понимаю, что вы имеете в виду сейчас. Просто проверил с Firefox на моем MBP, и теперь я вижу проблему. Вы можете использовать свойство 'border-collapse' для решения проблемы. Я соответствующим образом обновил свой ответ. – BenM

Анимация td с помощью jquery

ответ

Смежные вопросы