Пятница, 18.07.2025, 20:06
Приветствую Вас Гость | RSS
[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Выезжающая панель от $USERNAME$
EfLJДата: Четверг, 15.07.2010, 19:14 | Сообщение # 1
Читатель
Группа: Пользователи
Сообщений: 10
Репутация: 20
Статус:
Выезжает при наводке мышью.
Полностью кроссбраузерная.
На чистом JavaScript, никакого jQuery.

Установка:

1. Установим скрипт, который будет реализовывать плавание панели:

Code

   <script type="text/javascript">
       function slide(obj, direction, a) {
        clearInterval(window.z);
        counter = 0;
        z = setInterval(function () {
         if (a ? parseInt(obj.style.marginTop) < 0 : parseInt(obj.style.marginTop) > -300) {
          obj.style.marginTop = parseInt(obj.style.marginTop) + direction;
          counter++;
         } else {
          clearInterval(z);
         }
        },
        10);
       }
       var pad = document.getElementById('x');
       pad.onmouseover = function () {
        slide(this, 3, true);
       }
       pad.onmouseout = function () {
        slide(this, -3, false);
       }
       </script>

2. Установим саму панель:

Code
<div id="x" style="width: 100%; height: 300px; border-bottom: 5px dashed #eee; background: #555; position: absolute; margin-top: -300px;">
        <span style="color: white; font-weight: bold;">
            Slide Panel by $USERNAME$
         <br />
            Кстати, на чистом JS, без jQuery <img rel="usm" src="http://megasoft.3dn.ru/emoticons/Sypsena.gif" border="0" align="absmiddle" alt=":)">
         <br />
            Хотя кого это волнует.
        </span>
       </div>

Автор: $USERNAME$

 
  • Страница 1 из 1
  • 1
Поиск:


Copyright MyCorp © 2025Хостинг от uCoz