• Автор:

    Flesha
  • Добавлено:

    дек 07, 2012
  • Комментариев:

    2
  • Просмотров:

    3266

Гирлянда в шапку

Гирлянда в шапку

Гирлянда для сайта – не единственный способ украсить сайт к новому году. Вы можете выбрать новогодние иконки для сайта, а еще можете установить снег на сайт. Использовать несколько украшений одновременно не рекомендуется, т.к. из-за множества разных цветов и бесконечной анимации у пользователя может даже закружиться голова.

В main.tpl вставить перед
</head>


<style type="text/css">
#garland {position:absolute;top:0;left:0;background-image:url('http://site.ru/uploads/christmas-lights.png');height:36px;width:100%;overflow:hidden;z-index:99}
#nums_1 {padding:100px}
.garland_1 {background-position: 0 0}
.garland_2 {background-position: 0 -36px}
.garland_3 {background-position: 0 -72px}
.garland_4 {background-position: 0 -108px}
</style>

<div id="garland" class="garland_4"><div id="nums_1">1</div></div>

<script type="text/javascript">
function garland() {
nums = document.getElementById('nums_1').innerHTML
if(nums == 1) {document.getElementById('garland').className='garland_1';document.getElementById('nums_1').innerHTML='2'}
if(nums == 2) {document.getElementById('garland').className='garland_2';document.getElementById('nums_1').innerHTML='3'}
if(nums == 3) {document.getElementById('garland').className='garland_3';document.getElementById('nums_1').innerHTML='4'}
if(nums == 4) {document.getElementById('garland').className='garland_4';document.getElementById('nums_1').innerHTML='1'}
}

setInterval(function(){garland()}, 600)
</script>


Указать путь к картинке(2 строка скрипта):
http://site.ru/uploads/christmas-lights.png


Картинка:
Гирлянда в шапку
Вернуться

Комментарии:


  1. Martin → 9 декабря 2012 03:39
    Пошел лампочки искать, где то встречал все в одном архиве...
  2. Flesha → 9 декабря 2012 03:44
    Поделишься? вставлю в новость thumbup
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.