Анимация при смене фона
Здравствуйте.Есть код, меняет фон (картинку)
var img = 'fon.png'; $('.tab-in').css('background-image', function(index, oldValue){ if(oldValue==''){return img;}}).css('background-size','100% 100%') Подскажите как этот процесс анимировать?Не понимаю к чему .animate прикрутить, никак не выходит. |
ureech,
сделайте макет и попробуйте ещё раз описать что хотите анимировать или попробуйте вместо .css('background-size','100% 100%') .animate({'background-size' : '100%'},1000) |
Вложений: 1
Вот табы состоящие из двух частей(см.вложение).По клику меняется содержимое правого блока и фон левого.К правому анимацию применил.Теперь нужно прикрутить анимацию к background левого блока.
Вот html <div class="uitab"> <div class="tab-in"> <ul id="tabs"> <li><a class="tab" href="#tab-mus">Музыка</a></li> ........................................................ </ul> </div> здесь вкладки правого блока ..................................... <div id="tab-mus" > <div class="tab-in_1 animated"> </div> </div> ..................................... </div> Вот js $(function() { $('.tab').on('click', function(event) { event.preventDefault(); var id = this.getAttribute('href') var img = 'url(/templates/red&black/images/music/'+id.slice(1)+'.png)'; $('.tab-in_1').not($('.tab-in_1', id).toggleClass('zoomIn')).removeClass('zoomIn') $('.tab-in').css('background-image', function(index, oldValue){ if(oldValue==''){return img;}else{return img;}}).css('background-size','100% 100%') } ); } ); Вариант .animate({'background-size' : '100%'},1000) не пойдёт. |
ureech,
а в css добавить transition? пока более ничем ... может если сделаите макет, кто подскажет. |
Что такое макет? И в css transition попробую, но думаю не пройдёт, так как фон появляется из js и всё это в динамики.
|
ureech,
макет это то что можно запустить тут или в любой песочнице http://plnkr.co/edit/?p=preview, а не части кода |
Хорошо, вот упрощённый вариант, суть та-же.Прикрутить анимацию к .nav
|
Цитата:
|
Цитата:
|
ureech,
:) а куда смотреть - то, чего делать - то, по вашей ссылке? где живёт nav? |
Часовой пояс GMT +3, время: 18:29. |