Когда поле модифицируется, я хочу выделить цвет фона <div>
для этой строки.Затем медленно верните его в нормальное состояние.Поэтому я использую эффект цветной анимации пользовательского интерфейса jQuery и jQuery:
$('.example_row')
.css('backgroundColor', '#ff7f0')
.animate({backgroundColor: '#d4d4d4'}, 5000)
.html(modifiedContent);
Проблема в том, что общий фон не #d4d4d4
, это градиент.Поэтому в идеале я бы просто изменил непрозрачность фона с 1 на 0 для <div>
для этой строки.Как мне это сделать?Я попробовал эффект removeClass пользовательского интерфейса jQuery:
$('.example_row')
.addClass('modified')
.removeClass('modified', 5000)
.html(modifiedContent);
.modified имеет правило 1 css background-color: #ff7f00
.Проблема здесь в том, что удаление класса означает, что фон становится полностью белым, пока класс полностью не удалится, а затем внезапно изменится на истинный градиент фона.Выглядит плохо ...
Так что я знаю, что мог бы просто ввести новый <div>
со 100% шириной и высотой в пределах <div>
для этой строки и сделать простой .animate({opacity: 0})
.Но я не хочу этого делать по другим причинам ... есть ли здесь простое решение, которое не требует добавления дополнительного фона <div>
?
ОБНОВЛЕНИЕ : я создал пример моей ситуации на jsfiddle для более ясного объяснения.