Оригинальная кнопка "скачать" от programm-new

Кнопки 2012-Май-05 ruslansymvol 1.2k 199 3

Решил выложить видоизменённую мною кнопку "скачать" и вот что получилось

Установка

Сначала скачиваем картинку и вылаживаем в папку images
Затем в виде материалов ставим такой код:

Code

<div class="mtr_btns">
<style type="text/css">
.mtr_btns {
margin-left: 10px;
height: 42px;
overflow: hidden;
}
</style>
<center><?if($FILE_URL$)?><a href="$FILE_URL$" class="mtr_dwnld" onmouseover="$(this).stop().animate({marginTop:'0px'},100)" onmouseout="$(this).stop().animate({marginTop:'4px'},100)" style="margin-top: 0px; "> </div></a> $FILE_SIZE$)<?endif?></center>
<center><?if($RFILE_URL$)?><a href="$RFILE_URL$" target="_blank" class="mtr_dwnld" onmouseover="$(this).stop().animate({marginTop:'0px'},100)" onmouseout="$(this).stop().animate({marginTop:'4px'},100)" style="margin-top: 0px; "> </a><?endif?></center>
<style type="text/css">
.mtr_dwnld {
float: left;
margin-right: 5px;
margin-top: 4px;
background: url('/images/buttons_material.png') 0 0;
width: 173px;
height: 38px;
cursor: pointer;
}
</style>
</div>

Ну а для ленивцев скачивать делаем также только просто ставим код в страницу с материалами без скачивания картинки:

Code

<div class="mtr_btns">
<style type="text/css">
.mtr_btns {
margin-left: 10px;
height: 42px;
overflow: hidden;
}
</style>
<center><?if($FILE_URL$)?><a href="$FILE_URL$" class="mtr_dwnld" onmouseover="$(this).stop().animate({marginTop:'0px'},100)" onmouseout="$(this).stop().animate({marginTop:'4px'},100)" style="margin-top: 0px; "> </div></a> $FILE_SIZE$)<?endif?></center>
<center><?if($RFILE_URL$)?><a href="$RFILE_URL$" target="_blank" class="mtr_dwnld" onmouseover="$(this).stop().animate({marginTop:'0px'},100)" onmouseout="$(this).stop().animate({marginTop:'4px'},100)" style="margin-top: 0px; "> </a><?endif?></center>
<style type="text/css">
.mtr_dwnld {
float: left;
margin-right: 5px;
margin-top: 4px;
background: url('http://programm-new.ucoz.ru/meine/buttons_material.png') 0 0;
width: 173px;
height: 38px;
cursor: pointer;
}
</style>
</div>

Скачать Демо

Источник: http://programm-new.ucoz.ru

3 комментария

Порядок вывода комментариев: