Анимированная тень через плагин Shadow animation на jQuery
1 2 |
<link href="/css/demo.css" rel="stylesheet"> <script src="/js/jquery.animate-shadow-min.js"></script> |
2#: Блоки с тенью оформляются следующим способом:
1 2 3 |
<div id="box1" onmouseover="$('#box1').stop().animate({shadow: '0 0 30px #44f'})" onmouseout="$('#box1').stop().animate({shadow: '0 0 10px #000'})">mouse over</div> <div id="box2" onmouseover="$('#box2').stop().animate({shadow: '0 0 50px'}, 'fast')" onmouseout="$('#box2').stop().animate({shadow: '0 0 0'}, 'fast')">mouse over</div> <div id="box3" onmousedown="$('#box3').stop().animate({shadow: '3px 3px 3px', top: 3}, 'fast')" onmouseup="$('#box3').stop().animate({shadow: '10px 10px 15px', top: 0}, 'fast')">click me</div> |