Раскачивающийся снеговик в шапке сайта
Это новогодний скрипт uCoz, который заключается раскачивающийся снеговик в шапке. Он будет с левой стороны и не какой функций мешать не будет. Так как есть много кодов, которые устанавливаешь и они потом мешают к примеру горизонтальному меню и категориям на которые перейти нужно. Но этот исключение, как на светлом и на темном сайте он будет смотреться в новогодний дни, как красиво так и уместно на вашем сайте. Установка: Верх сайта и в самый его низ. Код <style> a.sg_tab { float: left; margin: -325px 0 0 100px} a.sg_tab img { -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; -ms-transition: all 1s ease-in-out; transition: all 1s ease-in-out; -moz-transform:rotate(0deg); -webkit-transform:rotate(0deg); -o-transform:rotate(0deg); -ms-transform:rotate(0deg); transform:rotate(0deg); } a.sg_tab.right_tab img { -moz-transform:rotate(-7deg); -webkit-transform:rotate(-7deg); -o-transform:rotate(-7deg); -ms-transform:rotate(-7deg); transform:rotate(-7deg); } a.sg_tab:hover img { -moz-transform:rotate(-15deg); -webkit-transform:rotate(-15deg); -o-transform:rotate(-15deg); -ms-transform:rotate(-15deg); transform:rotate(-15deg); } a.sg_tab.right_tab:hover img { -moz-transform:rotate(10deg); -webkit-transform:rotate(10deg); -o-transform:rotate(10deg); -ms-transform:rotate(10deg); transform:rotate(10deg); } </style> <a class="sg_tab right_tab" href="/"><img src="http://zornet.ru/Fresa/Stunget/how-to-draw.png" ></a> <script> /*раскачивание снеговика*/ $(document).ready(function() { function swing(){ $('.sg_tab').toggleClass('right_tab'); setTimeout(swing, 1000); } swing(); }); </script> Стили прописаны в самом коде и все вместе нужно прописывать. |
Поделиться в социальных сетях
Материал разместил
Комментарии: 10 | |
| |