Форма входа

mvcreative

Старая форма входа

  • Страница 1 из 1
  • 1
Модератор форума: BSide  
Форум MVCreative » сделаем креативный uCoz » Общение и архив » Архив старых тем » Simple Scrollbar | js & css
Simple Scrollbar | js & css
footballmasterДата: Воскресенье, 31.10.2010, 11:06 | Сообщение # 1
Спикер
Группа: Пользователи
Пользователь №: 191
Сообщений: 207
Награды: 9
Репутация: 43
Статус: оффлайн
Простая полоса прокрутки с использованием js и css

Демо
---
Архивы

Установка:

Это в head и /head

Code
<style type="text/css">
.Container {
   position: absolute;
   top: 50px; left: 100px;
   width: 400px;
   height: 200px;
   background: #FFF url(images/container_background.gif) no-repeat;
}
#Scroller-1 {  
   position: absolute;  
   overflow: hidden;
   width: 400px;
   height: 200px;
}
#Scroller-1 p {
   margin: 0; padding: 10px 20px;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 11px;
   text-indent: 20px;
   color: #6F6048;
}
.Scroller-Container {
   position: absolute;
   top: 0px; left: 0px;
}
#Scrollbar-Container {
   position: absolute;
   top: 40px; left: 60px;
}
.Scrollbar-Up {
   cursor: pointer;
   position: absolute;
}
.Scrollbar-Track {
   width: 20px; height: 161px;
   position: absolute;
   top: 36px; left: 4px;
   background: transparent url(images/scrollbar_track.gif) no-repeat center center;
}
.Scrollbar-Handle {
   position: absolute;
   width: 20px; height: 22px;
}
.Scrollbar-Down {
   cursor: pointer;
   position: absolute;
   top: 187px;
}
</style>
<script type="text/javascript" src="src/jsScroller.js"></script>
<script type="text/javascript" src="src/jsScrollbar.js"></script>
<script type="text/javascript">
var scroller  = null;
var scrollbar = null;
window.onload = function () {
   scroller  = new jsScroller(document.getElementById("Scroller-1"), 400, 200);
   scrollbar = new jsScrollbar (document.getElementById("Scrollbar-Container"), scroller, false);
}
</script>

Активирование:

Это вставьте в любое место где хотите видеть скрипт

Code
<div id="Scrollbar-Container">
     <img src="images/up_arrow.gif" class="Scrollbar-Up" />
     <img src="images/down_arrow.gif" class="Scrollbar-Down" />
     <div class="Scrollbar-Track">
       <img src="images/scrollbar_handle.gif" class="Scrollbar-Handle" />
     </div>
   </div>
<div class="Container">
    
   <div id="Scroller-1">
    <div class="Scroller-Container">
       Здесь ваш текст
     </div>
   </div>
</div>

Вот и всё! Не-забудьте залить себе файлы из архива.





Кто хочет заказать у меня дизайн сайта стучите в Skype: alexandru_lampard ; ICQ: 614017088
 
вверх
Angry4178Дата: Пятница, 12.11.2010, 17:59 | Сообщение # 2
Спикер
Группа: Пользователи
Пользователь №: 85
Сообщений: 255
Награды: 5
Репутация: 14
Статус: оффлайн
Оо, отлично. Хороший рип. "+" отправлен


 
вверх
forumzaДата: Воскресенье, 14.11.2010, 02:36 | Сообщение # 3
Спикер
Группа: Пользователи
Пользователь №: 363
Сообщений: 233
Награды: 3
Репутация: 11
Статус: оффлайн
footballmaster, Спасибо я ккраз искал похожее !


Бесплатно Скачать ADOBE PHOTOSHOP CS 5

 
вверх
Форум MVCreative » сделаем креативный uCoz » Общение и архив » Архив старых тем » Simple Scrollbar | js & css
  • Страница 1 из 1
  • 1
Поиск: