Анимированная кнопка загрузки счетчика загрузок для uCoz | Animated download counter download button for uCoz

Рассмотренная анимированная кнопка счетчика скачивания идеально подходит для использования в вашем файловом архиве на платформе uCoz.

Установка:

1. Скачайте архив и файлы из архива загрузите в корень сайта.
2. Заходим в П.У - Дизайн - Управление дизайном - Каталог файлов - Страница материала и комментариев к нему, и там ПЕРЕД </head>
   

   <script type="text/jаvascript" src="/Knopka/Download.js"></script>  
     <script type="text/jаvascript">  
     $(document).ready(function() {  
     $('.homebutton,.downloadbutton').append('<span class="hover"></span>').each(function () {  
     var $span = $('> span.hover', this).css('opacity', 0);  
     $(this).hover(function () {  
     $span.stop().fadeTo(500, 1);  
     }, function () {  
     $span.stop().fadeTo(500, 0);  
     });  
     });  
     });  
     </script>

   
   

3. Заходим в П.У - Дизайн - Управление дизайном (CSS), в самый низ вставляем:

   .downlod_title {  
     font-family: tahoma;  
     font-size: 10px;  
     color: #FFFFFF;  
     padding-top: 2px;  
     height: 23px;  
     }  
     .downlod_footer {  
     font-family: tahoma;  
     font-size: 10px;  
     color: #FFFFFF;  
     padding-bottom: 2px;  
     height: 23px;  
     }  
     .downloadbutton {  
     float: left;  
     width:107px;  
     height:38px;  
     display:block;  
     background-image:url(/Knopka/twobuttons.png);  
     background-position: top right;  
     }  
     .downloadbutton span.hover{  
     position: absolute;  
     display: block;  
     width:107px;  
     height:38px;  
     background-position: bottom right;  
     background-image:url(/Knopka/twobuttons.png);  
     }  
     .homebutton {  
     float: left;  
     width:120px;  
     height:38px;  
     display:block;  
     background-image:url(/Knopka/twobuttons.png);  
     background-position: top left;  
     }  
     .homebutton span.hover{  
     position: absolute;  
     display: block;  
     width:120px;  
     height:38px;  
     background-position: bottom left;  
     background-image:url(/Knopka/twobuttons.png);  
     } 

   
   

4. Заходим в П.У - Дизайн - Управление дизайном - Каталог файлов - Страница материала и комментариев к нему, и в нужно место вставляем код самой кнопки скачать для ucoz

   <table border='0' cellspacing='0' cellpadding='0' align='center' background='/Knopka/downlod.png' wight='220' height='84'>  
     <tr>  
     <td align='center' class='downlod_title'>$ENTRY_TITLE$</td>  
     </tr>  
     <tr>  
     <td><a href='$FILE_URL$' class='homebutton'></a>  
     <a href='$RFILE_URL$' class='downloadbutton'></a></td>  
     </tr>  
     <tr>  
     <td align='center' class='downlod_footer'>Загрузок $LOADS$</td>  
     </tr>  
     </table>

Приятного использования!