Бесплатный форум: форум поддержки
Добро пожаловать на форум поддержки сервиса Forum2x2 !

Для полноценной работы с форумом,
пожалуйста, войдите на форум под своим логином (если вы уже зарегистрированы) или же зарегистрируйтесь.


С нашей помощью вы можете создать форум,
похожий на этот!
Мы в социальных сетях

Правила форума

для обязательного прочтения!


Внимание! Важная информация для РЕГИСТРАЦИИ на форуме:

Пожалуйста, не регистрируйтесь на этом форуме с электронными адресами mail.ru, bk.ru, inbox.ru, list.ru - вам может не прийти письмо со ссылкой активации!
Вы можете воспользоваться адресами типа yandex.ru, rambler.ru, gmail.com и т.д.
Интересные решения
Быстрый переход к сервисам: j-p-g.net Видео фоторедактор Транслит

Скрипт на фейерверк

Предыдущая тема Следующая тема Перейти вниз

Скрипт на фейерверк

Сообщение автор Sunnyta в Вт 5 Май - 20:28

Скрипт работающий, но для наших виджетов его можно упростить и сделать понятнее... кто возьмется? wink
Код:
<html lang="ru">

<head>



<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<meta http-equiv="Content-Language" content="ru">

<style>
<!--

BODY
{
   background      :   white;
}

TABLE
{
   width         :   100%;
   height         :   100%;
}

#ID_ANIMATE
{
   position      :   relative;
   width         :   420px;
   height         :   256px;
   overflow      :   hidden;
   background      :   blue;
}

#ID_ANIMATE DIV
{
   position      :   absolute;
   width         :   2px;
   height         :   2px;
   font-size      :   0px;
   z-index         :   2;
}

#ID_ANIMATE #ID_LOGO
{
   font         :   normal 14px "Courier New", monotype;
}

-->
</style>

</head>

<body>

<TABLE>
<TR>
   <TD align="center" valign="middle">
      <DIV ID="ID_ANIMATE">
         <TABLE style="z-index: 2;">
         <TR>
            <TD align="center" valign="middle" ID="ID_LOGO">
               <span style="color: white;">примерчик</span>
               <a style="color: blue;" </a>
            </TD>
         </TR>
         </TABLE>
      </DIV>
   </TD>
</TR>
</TABLE>

<script type="text/javascript">
<!--

// Code by Victor V. Vakchturov (http://codeguru.ru)

// Настройки

var nStarCount   = 256;   // Количество звезд фейерверка
var fMinSpeed   = 0.1;   // Минимальная скорость звезд
var fMaxSpeed   = 5.0;   // Максимальная скорость звезд
var nMinLive   = 32;   // Минимальное время жизни элемента
var nMaxLive   = 42;   // Максимальное время жизни элемента
var fDSpeed   = 0.94;   // Величина уменьшения скорости элементов

// --

var nTimerID   = 0;
var aStars   = new Array(nStarCount);
var oAnimate   = document.getElementById("ID_ANIMATE");

var nWidth   = oAnimate.offsetWidth;
var nHeight   = oAnimate.offsetHeight;

// Еще настройки

var nMinX   = Math.round(nWidth / 4);
var nMaxX   = Math.round(nWidth / 4 * 3);
var nMinY   = Math.round(nHeight / 4);
var nMaxY   = Math.round(nHeight / 4 * 3);


function UpdateStarPos(i)
{
   var oDiv = aStars[i];

   oDiv.style.top   = Math.round(oDiv.y).toString() + "px";
   oDiv.style.left   = Math.round(oDiv.x).toString() + "px";
}

function UpdateStarBgColor(i)
{
   var oDiv = aStars[i];

   oDiv.style.backgroundColor = "RGB(" +
      Math.round(Math.random() * 0xFF).toString() + "," +
      Math.round(Math.random() * 0xFF).toString() + "," +
      Math.round(Math.random() * 0xFF).toString() + ")";
}

function ResetStar(i, x, y)
{
   var oDiv = aStars[i];

   oDiv.x      = x;
   oDiv.y      = y;

   oDiv.fSpeed   = Math.random() * (fMaxSpeed - fMinSpeed) + fMinSpeed;


   var fAngle   = Math.random() * 2 * Math.PI;

   oDiv.fCos   = Math.cos(fAngle);
   oDiv.fSin   = Math.sin(fAngle);

   oDiv.nLive   = Math.round(Math.random() * (nMaxLive - nMinLive) + nMinLive);

   UpdateStarPos(i);
   UpdateStarBgColor(i);
}

function MoveStars()
{
   var bEndShow = true;

   for(var i = 0; i < nStarCount; i++)
   {
      var oDiv = aStars[i];

      if(oDiv.nLive)
      {
         oDiv.x += oDiv.fSpeed * oDiv.fCos;
         oDiv.y += oDiv.fSpeed * oDiv.fSin;

         oDiv.fSpeed *= fDSpeed;

         if(oDiv.fSpeed < 0)
            oDiv.fSpeed = 0;

         UpdateStarPos(i);
         UpdateStarBgColor(i);

         oDiv.nLive--;

         if(!oDiv.nLive)
            oDiv.style.backgroundColor = "black";

         bEndShow = false;
      }
   }

   if(bEndShow)
   {
      window.clearInterval(nTimerID);
      window.setTimeout(StartFireShow, 1500);
   }
}

function StartFireShow()
{
   var x = Math.round(Math.random() * (nMaxX - nMinX)) + nMinX;
   var y = Math.round(Math.random() * (nMaxY - nMinY)) + nMinY;

   for(var i = 0; i < nStarCount; i++)
      ResetStar(i, x, y);

   nTimerID = window.setInterval(MoveStars, 40);
}

function GenerateStars()
{
   for(var i = 0; i < nStarCount; i++)
   {
      var oDiv = aStars[i] = document.createElement("DIV");

      oDiv.style.width   = "1px";
      oDiv.style.height   = "1px";
      oDiv.style.overflow   = "hidden";
      oDiv.style.position   = "absolute";

      oAnimate.appendChild(oDiv);
   }
}

GenerateStars();

StartFireShow();

// -->
</script>

</body>
</html>
avatar
Sunnyta
 

Сообщения : 1579
Регистрация : 2008-03-20
Благодарности : 63

Без предупреждений

http://www.sun-place.com/

Вернуться к началу Перейти вниз

Предыдущая тема Следующая тема Вернуться к началу


 
Права доступа к этому форуму:
Вы не можете отвечать на сообщения