Главная | Регистрация | Вход Приветствую Вас Гость | RSS
Меню сайта
В начало Главная страница Фотогалерея Наш Форум Каталог файлов Загрузка файлов Наша группа в Steam Сервер Minecraft Карта мира
Мини-чат
Коментарии
CUBA написал:
проблема решилась?
LuxeHD написал:
Клиент почему-то не
CUBA написал:
Клиент теперь качаем
CUBA написал:
Changelog: 11.10.201
CUBA написал:
)
Статистика

Зарег. на сайте
Всего: 724
Новых за месяц: 0
Новых за неделю: 0
Новых вчера: 0
Новых сегодня: 0
Из них
Админинистраторов: 1
Модераторов: 8
Проверенных: 49
Обычных юзеров: 649
Из них
Парней:670
Девушек: 52

  • Новый игрок
  • vvova8212

  • Здесь были
  • Счетчики
    Поиск
    [ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
    • Страница 1 из 1
    • 1
    Форум WELL COME » Общий форум » Всё для Ucoz » переливающееся меню на сайт
    переливающееся меню на сайт
    CUBAДата: Среда, 16.12.2009, 11:04 | Сообщение # 1
    Создатель
    Группа: Администраторы
    Сообщений: 1399
    Награды: 52
    Репутация: 143
    Статус: Offline
    Code
    /*******************************************************************     
    * File    : JSFX_LinkFader.js  ? JavaScript-FX.com  
    * Created : 2002/09/05     
    * Riped  : VOLKODAV  (777volkodav@mail.ru) www.coool.net.ru     
    * Purpose : To create a more dynamic a:hover using fading  
    * History     
    * Date         Version        Description     
    * 2002-09-05    1.0  First version  
    ***********************************************************************/  
    /*** Create some global variables ***/  
    if(!window.JSFX)JSFX=new Object();  

    var LinkFadeInStep=20;  
    var LinkFadeOutStep=5;  
    var LinkEndColor="00FF00"  

    var LinkStartColor="FFFFFF";  
    var LinkFadeRunning=false;  

    document.onmouseover = theOnOver;  
    document.onmouseout  = theOnOut;  
    if(document.captureEvents)  
            document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);  

    /***********************************************  
    *  
    * Function    : getColor  
    *  
    * Parameters  :    start - the start color (in the form "RRGGBB" e.g. "FF00AC")  
    *   end - the end color (in the form "RRGGBB" e.g. "FF00AC")  
    *   percent - the percent (0-100) of the fade between start & end  
    *  
    * returns   : color in the form "#RRGGBB" e.g. "#FA13CE"  
    *  
    * Description : This is a utility function. Given a start and end color and  
    *      a percentage fade it returns a color in between the 2 colors  
    *  
    * Author   : www.JavaScript-FX.com  
    *  
    *************************************************/  
    function hex2dec(hex){return(parseInt(hex,16));}  
    function dec2hex(dec){return (dec < 16 ? "0" : "") + dec.toString(16);}     
    function getColor(start, end, percent)  
    {  

         var r1=hex2dec(start.slice(0,2));  
         var g1=hex2dec(start.slice(2,4));  
         var b1=hex2dec(start.slice(4,6));  

         var r2=hex2dec(end.slice(0,2));  
         var g2=hex2dec(end.slice(2,4));  
         var b2=hex2dec(end.slice(4,6));  

         var pc=percent/100;  

         var r=Math.floor(r1+(pc*(r2-r1)) + .5);  
         var g=Math.floor(g1+(pc*(g2-g1)) + .5);  
         var b=Math.floor(b1+(pc*(b2-b1)) + .5);  

         return("#" + dec2hex(r) + dec2hex(g) + dec2hex(b));  
    }  
    /************************************************/  
    JSFX.getCurrentElementColor = function(el)     
    {     
         var result = LinkStartColor;  

         if (el.currentStyle)     
          result = (el.currentStyle.color);     
         else if (document.defaultView)     
          result = (document.defaultView.getComputedStyle(el,'').getPropertyValue('color'));  
         else if(el.style.color) //Opera  
          result = el.style.color;  

         if(result.charAt(0) == "#")      //color is of type #rrggbb  
          result = result.slice(1, 8);  
         else if(result.charAt(0) == "r") //color is of type rgb(r, g, b)  
         {  
          var v1 = result.slice(result.indexOf("(")+1, result.indexOf(")") );  
          var v2 = v1.split(",");  
          result = (dec2hex(parseInt(v2[0])) + dec2hex(parseInt(v2[1])) + dec2hex(parseInt(v2[2])));  
         }  

         return result;  
    }     
    JSFX.findTagIE = function(el)  
    {  
              while (el && el.tagName != 'A')  
                    el = el.parentElement;  
         return(el);  
    }  
    JSFX.findTagNS= function(el)  
    {  
              while (el && el.nodeName != 'A')  
                    el = el.parentNode;  
         return(el);  
    }  
    function theOnOver(e)  
    {  
         var lnk;  
         if(window.event)  
          lnk=JSFX.findTagIE(event.srcElement);  
         else  
          lnk=JSFX.findTagNS(e.target);  

         if(lnk)  
          JSFX.linkFadeUp(lnk);  
    }  
    JSFX.linkFadeUp = function(lnk)  
    {  
         if(lnk.state == null)  
         {  
          lnk.state = "OFF";  
          lnk.index = 0;  
          lnk.startColor = JSFX.getCurrentElementColor(lnk);  
          lnk.endColor = LinkEndColor;  
         }  

         if(lnk.state == "OFF")  
         {  
          lnk.state = "FADE_UP";  
          JSFX.startLinkFader();  
         }  
         else if( lnk.state == "FADE_UP_DOWN"  
          || lnk.state == "FADE_DOWN")  
         {  
          lnk.state = "FADE_UP";  
         }  
    }  
    function theOnOut(e)  
    {  
         var lnk;  
         if(window.event)  
          lnk=JSFX.findTagIE(event.srcElement);  
         else  
          lnk=JSFX.findTagNS(e.target);  

         if(lnk)  
          JSFX.linkFadeDown(lnk);  
    }  
    JSFX.linkFadeDown = function(lnk)  
    {  
         if(lnk.state=="ON")  
         {  
          lnk.state="FADE_DOWN";  
          JSFX.startLinkFader();  
         }  
         else if(lnk.state == "FADE_UP")  
         {  
          lnk.state="FADE_UP_DOWN";  
         }  
    }  
    JSFX.startLinkFader = function()  
    {  
         if(!LinkFadeRunning)  
          JSFX.LinkFadeAnimation();  
    }  
    /*******************************************************************  
    *  
    * Function    : LinkFadeAnimation  
    *  
    * Description : This function is based on the Animate function  
    *          of animate.js (animated rollovers).  
    *          Each fade object has a state. This function  
    *          modifies each object and changes its state.  
    *****************************************************************/  
    JSFX.LinkFadeAnimation = function()  
    {  
         LinkFadeRunning = false;  
         for(i=0 ; i<document.links.length ; i++)  
         {  
          var lnk = document.links[i];  
          if(lnk.state)  
          {  
           if(lnk.state == "FADE_UP")  
           {  
            lnk.index+=LinkFadeInStep;  
            if(lnk.index > 100)  
             lnk.index = 100;  
            lnk.style.color=getColor(lnk.startColor, lnk.endColor, lnk.index);  

            if(lnk.index == 100)  
             lnk.state="ON";  
            else  
             LinkFadeRunning = true;  
           }  
           else if(lnk.state == "FADE_UP_DOWN")  
           {  
            lnk.index+=LinkFadeOutStep;  
            if(lnk.index>100)  
             lnk.index = 100;  
            lnk.style.color=getColor(lnk.startColor, lnk.endColor, lnk.index);  

            if(lnk.index == 100)  
             lnk.state="FADE_DOWN";  
            LinkFadeRunning = true;  
           }  
           else if(lnk.state == "FADE_DOWN")  
           {  
            lnk.index-=LinkFadeOutStep;  
            if(lnk.index<0)  
             lnk.index = 0;  
            lnk.style.color=getColor(lnk.startColor, lnk.endColor, lnk.index);  
             
            if(lnk.index == 0)  
             lnk.state="OFF";  
            else  
             LinkFadeRunning = true;  
           }  
          }  
         }  
         /*** Check to see if we need to animate any more frames. ***/  
         if(LinkFadeRunning)  
          setTimeout("JSFX.LinkFadeAnimation()", 40);  
    }

    Создаем на компе тхт файл, перименовываеш его в .js и вставляем туда код. Далее нужно поменять настройки скрипта. Думаю нам хватит настроить только цвета ссылок. Они настраиваются в следующих строках:

    var LinkEndColor="00FF00" - цвет ссылки к которому она будет менять свой цвет
    var LinkStartColor="FFFFFF"; - цвет ссылки, когда на нее не наведен курсор

    Далее создаем в файл менеджере папку jsfiles и загружаеш туда js файл с скриптом и на каждой странице, где нужен этот эффект вставляем код:

    Code
    <SCRIPT TYPE="text/javascript" SRC="/jsfiles/JSFX_green.js"></SCRIPT>


    >здесь должна быть мудрая мысль<
     
    ZombieДата: Четверг, 07.01.2010, 11:51 | Сообщение # 2
    Сержант
    Группа: Пользователи
    Сообщений: 32
    Награды: 0
    Репутация: 0
    Статус: Offline
    Скрин выложи...

     
    yyyMДата: Пятница, 08.01.2010, 01:34 | Сообщение # 3
    Полковник
    Группа: Модераторы
    Сообщений: 255
    Награды: 16
    Репутация: 56
    Статус: Offline
    может переиминовываем на JSFX_green.js, а не просто на .js ?

    аыы)
     
    yyyMДата: Пятница, 08.01.2010, 01:41 | Сообщение # 4
    Полковник
    Группа: Модераторы
    Сообщений: 255
    Награды: 16
    Репутация: 56
    Статус: Offline

    вот собственно скрин
    Прикрепления: 8400790.jpg (33.9 Kb)


    аыы)
     
    Форум WELL COME » Общий форум » Всё для Ucoz » переливающееся меню на сайт
    • Страница 1 из 1
    • 1
    Поиск:
    Статистика Форума
    Последнии темы Читаемые темы Лучшии пользователи Сегодня общались
  • Мое скромное творчество (7)
  • Какие модификации нам поставить?! (23)
  • Сервер Minecraft (11)
  • Разбан и Желающие Разбан (753)
  • Хочу стать Админом! (628)
  • Бананы (498)
  • CUBA
  • Steel
  • DEMON
  • yyyM
  • -Барс-
  • Профиль
    MP3
    Новое на Форуме
    написал:
    13:11 Суббота ZeeKee
    написал:
    14:24 Понедельник ZeeKee
    написал:
    10:29 Среда CUBA
    написал:
    10:37 Среда CUBA
    написал:
    20:12 Вторник Steel
    Top пользователей
    Опрос
    Вы курите?
    Всего ответов: 372
    Design by © WellCome.moy.su 2024