jQuery анимированный фоновый рисунок из CSS

Question

Я работаю над веб-сайтом (в настоящее время на стадии планирования и проектирования), и у меня есть несколько таблиц с заданным фоновым изображением.Было бы неплохо (по дизайну) анимировать прозрачность фонового изображения при наведении мыши.Как я вижу в API jQuery - это невозможно сделать.(или может?)

Так что я нашел другое не очень чистое "решение".

Итак, мой вопрос - может ли это сработать?-> (псевдокод jQuery)

for each table in body
set cloneOfMyImage.Postition = table.Position
set cloneOfMyImage.Height = table.Height
set cloneOfMyImage.Width = table.Width
set cloneOfMyImage.Opacity = 0

В основном -> Я создаю «клон» фонового изображения в той же позиции, что и каждая таблица, с тем же размером, что и каждая таблица, и заставляю его выглядетькак фон появляется при наведении мыши.

Спасибо за ваше время.

Answer 1

Это бы сработало, но также увеличило бы вес браузера, если у вас много таблиц, из-за DOM Reflow , конечно, это будет зависеть от браузера и компьютера, но яЯ предполагаю, что вы хотите, чтобы это работало очень плавно для каждого пользователя.

Возможно, вы захотите рассмотреть анимацию положения фона изображения для создания анимации .