Переход к прозрачному с использованием функции подсветки jQuery - PullRequest
Новая
       28

Переход к прозрачному с использованием функции подсветки jQuery

0 голосов
/ 23 июня 2011

Эта тема , кажется, частично отвечает на мой вопрос, но в этой теме нет ответов, и большинство комментариев - это больше обсуждение и вопросы, чем попытка решить вопрос ОП ...

Отличие в моем случае от вышеупомянутого поста состоит в том, что у меня есть фоновое изображение, к которому я должен исчезнуть. Как и сейчас, цвет переходит к моему заданному цвету, затем становится белым, а затем к фоновому изображению. Вы можете видеть это в этом jsFiddle .

Есть ли способ перехода от моего заданного цвета, затем прямо к прозрачному, а не к белому и затем прозрачному?

UPDATE:

После комментариев с musicinmyhead я некоторое время работал с эффектом Position пользовательского интерфейса и до сих пор не могу заставить его работать в FF. Я добавил следующий код для эффекта Position (см. Обновленную jsFiddle по ссылке выше): 

$('.checkwrap').position({
    'my': 'left top',
    'at': 'left top',
    'of': $('#classesTable td:eq(0)')
});

Добавление, которое не имело "эффекта" (простите за каламбур), поэтому мне интересно, правильно ли я понимаю синтаксис. Я также попытался поиграть с css, чтобы посмотреть, изменит ли это что-нибудь - ну, это произошло, но ничего, что я сделал, не исправило это ...

1 Ответ

2 голосов
/ 24 июня 2011

Поскольку «прозрачный» не является цветом, вы, вероятно, не сможете изменить цвет фона таким образом. Лучше всего добавить элемент того же размера, что и ячейка таблицы, содержащую флажок, а затем анимировать этот добавленный элемент со 100% непрозрачности до 0% (имитируя переход от красного к фону). Затем вы можете удалить этот элемент динамически.

Я обновил ваш jsFiddle , чтобы вы могли видеть, о чем я говорю, был добавлен быстрый класс CSS, а также убедился, что элементы "td" стилизованы в position: относительный (в противном случае абсолютно позиционированный добавленный div просто повсюду).

Еще одно быстрое замечание: Есть несколько других способов сделать это, например, динамическое изменение размера / позиционирования добавляемого элемента, и это, вероятно, будет немного более элегантным, но это вполне подойдет вашей проблеме. на данный момент.

...