prowebber.ru - Тут есть все для настоящих вебмастеров

Чтение RSS Мы в твиттере
«    Декабрь 2016    »
ПнВтСрЧтПтСбВс
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
 

Выпадающее меню


Данный материал предоставлен сайтом ProWebber.ru исключительно в ознакомительных целях. Администрация не несет ответственности за его содержимое.
У нас вы можете скачать бесплатно Выпадающее меню.


Выпадающее меню

Данный урок подготовлен для Вас командой сайта: ruseller.com
Источник урока: tympanus.net
Реализации для dle DarkneZ
Название хака: Выпадающее меню
Версия DLE: 8.3 и ниже
Проверен: Opera, IE, Mozilla

1. Зайти в папку с Вашим шаблоном. Открыть файл main.tpl. После тега вставить:
<ul id="navigation">
<li class="home"><a href=""><span>Home</span></a></li>
<li class="about"><a href=""><span>About</span></a></li>
<li class="search"><a href=""><span>Search</span></a></li>
<li class="photos"><a href=""><span>Photos</span></a></li>
<li class="rssfeed"><a href=""><span>Rss Feed</span></a></li>
<li class="podcasts"><a href=""><span>Podcasts</span></a></li>
<li class="contact"><a href=""><span>Contact</span></a></li>
</ul>

Ниже добавить:
<script type="text/javascript" src="{THEME}/js/jquery-1.3.2.js"></script>
        <script type="text/javascript">
            $(function() {
                var d=300;
                $('#navigation a').each(function(){
                    $(this).stop().animate({
                        'marginTop':'-80px'
                    },d+=150);
                });

                $('#navigation > li').hover(
                function () {
                    $('a',$(this)).stop().animate({
                        'marginTop':'-2px'
                    },200);
                },
                function () {
                    $('a',$(this)).stop().animate({
                        'marginTop':'-80px'
                    },200);
                }
            );
            });
        </script>

2. Зайти по адресу Ваш шаблон/css и открыть файл style.css. В самом низу добавить:
ul#navigation {
    position: fixed;
    margin: 0px;
    padding: 0px;
    top: 0px;
    right: 10px;
    list-style: none;
    z-index:999999;
    width:98%;
}
ul#navigation li {
    width: 103px;
    display:inline;
    float:left;    
}
ul#navigation li a {
    display: block;
    float:left;
    margin-top: -2px;
    width: 100px;
    height: 25px;
    background-color:#E7F2F9;
    background-repeat:no-repeat;
    background-position:50% 10px;
    border:1px solid #BDDCEF;
    text-decoration:none;
    text-align:center;
    padding-top:80px;
    -moz-border-radius:0px 0px 10px 10px;
    -webkit-border-bottom-right-radius: 10px;
    -webkit-border-bottom-left-radius: 10px;
    -khtml-border-bottom-right-radius: 10px;
    -khtml-border-bottom-left-radius: 10px;
    opacity: 0.7;
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
ul#navigation li a:hover{
     background-color:#CAE3F2;
}
ul#navigation li a span{
    letter-spacing:2px;
    font-size:11px;
    color:#60ACD8;
    text-shadow: 0 -1px 1px #fff;      
}
ul#navigation .home a{
    background-image: url(../images/home.png);
}
ul#navigation .about a      {
    background-image: url(../images/id_card.png);
}
ul#navigation .search a      {
    background-image: url(../images/search.png);
}
ul#navigation .podcasts a      {
    background-image: url(../images/ipod.png);
}
ul#navigation .rssfeed a   {
    background-image: url(../images/rss.png);
}
ul#navigation .photos a     {
    background-image: url(../images/camera.png);
}
ul#navigation .contact a    {
    background-image: url(../images/mail.png);
}

  body{
          
        .header
        {
            width:600px;
            height:56px;
            position:absolute;
            top:50%;
            left:10px;
            background:#fff url(title.png) no-repeat top left;
        }

        a.back{
            width:256px;
            height:73px;
            position:absolute;
            bottom:15px;
            right:15px;
            background:#fff url(codrops_back.png) no-repeat top left;
        }
        a.dry{
            position:absolute;
            bottom:15px;
            left:15px;
            text-align:left;
            font-size:12px;
            color:#ccc;
            text-transform:uppercase;
            text-decoration:none;
        }

3. Качаем исходные файлы и закидываем в папку с шаблоном
Внимание! У вас нет прав для просмотра скрытого текста.

P.S. если у вас присутствует файл style.css заменять его не следует!


Отредактировал 5Nizza - 7 февраля 2010
Причина: 5Nizza аФтор детектед )
0
Просмотры: 20174 VIP ProWebber | Комментарии (25)
Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо войти на сайт под своим именем.

#1Mr.Fresh

  • 7 февраля 2010 17:29
  • Регистрация: 21.11.2009
  • ICQ: 4882710
  • Комментариев: 341
http://4webing.ru

0

#2chak

  • 7 февраля 2010 17:38
  • Регистрация: 3.01.2010
  • ICQ: 8528342
  • Комментариев: 446
  • Выкл.
Mr.Fresh,
А ну да, ступил. Спасибо!

0

#3nsdss

  • 7 февраля 2010 17:48
  • Регистрация: 10.01.2010
  • ICQ: --
  • Комментариев: 457
Гы. Прикольно. Сходил на сайт, погрался. даже и незнаю, устанавливать или нет biggrin
Во-во, поигрался еще, и придумал, точнее вспомнил .КТо сделает что бы ТОЧНО также но сбоку поазывалась форма типа вы еще не с нами? зарегистрируйтесь плиз и т.п. Ну думаю, что вы поняли о чем я

--------------------

0

#45Nizza

  • 7 февраля 2010 18:08
  • Регистрация: 22.09.2009
  • ICQ: --
  • Комментариев: 345
ph34r в наглую реклама сайта ... это с русселера.. и наглое присуждение авторства себе ... имхо уже не уважение вызывает diablo

0

#5DarkneZ

  • 7 февраля 2010 18:08
  • Регистрация: 13.10.2009
  • ICQ: 9115263
  • Комментариев: 120
Жду как всегда обливаний! типа новость с..ил! давайте не скупитесь!))

--------------------

0

#6ТорЧок

  • 7 февраля 2010 18:15
  • Регистрация: 5.01.2010
  • ICQ: --
  • Комментариев: 247
DarkneZ,
А ты хочешь, чтобы тебя хвалили за то, что присвоил чужой труд?! dash

--------------------

0

#75Nizza

  • 7 февраля 2010 18:25
  • Регистрация: 22.09.2009
  • ICQ: --
  • Комментариев: 345
DarkneZ,
когда ты реально что нить со временем сделаешь хорошее сам и какой нить олень это присвоит думаю тебе будет не приятно mad и ты будешь так же возмущаться.. это делал не я .. но не люблю присуждения авторства себе mad

0

#8DarkneZ

  • 7 февраля 2010 18:38
  • Регистрация: 13.10.2009
  • ICQ: 9115263
  • Комментариев: 120
Ну вот другое дело! давайте жоще! аааа! кайфую!!!!!! yahoo
З,Ы. я не горил что я атор! я всего лишь написал подробную установку на ДЛЕ!

--------------------

0

#95Nizza

  • 7 февраля 2010 18:42
  • Регистрация: 22.09.2009
  • ICQ: --
  • Комментариев: 345
Цитата: DarkneZ
Автор идеи и реализации DarkneZ

это что пушкин чтоли ?

0

#10ТорЧок

  • 7 февраля 2010 18:43
  • Регистрация: 5.01.2010
  • ICQ: --
  • Комментариев: 247
5Nizza,
crazy У этого мазахиста полным ходом идёт раздвоение личности.

--------------------

0

#11Bagner

  • 7 февраля 2010 18:45
  • Регистрация: 27.11.2009
  • ICQ: --
  • Комментариев: 308
5Nizza,

Ну блин ... начал спор ;) Ну присудил себе авторство, пусть радуется. Нам то какое дело !? Лишь бы хак людям нравился.

--------------------

0

#12Mr.Fresh

  • 7 февраля 2010 19:10
  • Регистрация: 21.11.2009
  • ICQ: 4882710
  • Комментариев: 341
всё тему закрыли ... качаем и радуемся biggrin
всё флуд будет удаляться ..
а если по делу то вообще вещь красивая
комент отредактил ©5Nizza =)



--------
ЫЫЫЫЫЫЫЫы хДД

0

#13explOit

  • 7 февраля 2010 20:46
  • Регистрация: 16.11.2009
  • ICQ: --
  • Комментариев: 271
Цитата: DarkneZ
я всего лишь написал подробную установку на ДЛЕ!

что ты там написал подробного? тупо списал, на руселлере точно также,просто ты написал пути где лежат файлы, но ты посчитал что этого достаточно что бы присоить себе чужой труд...

--------------------

0

#14DarkneZ

  • 7 февраля 2010 21:12
  • Регистрация: 13.10.2009
  • ICQ: 9115263
  • Комментариев: 120
идеи и реализации написания кода дле!

--------------------

0

#155Nizza

  • 7 февраля 2010 21:12
  • Регистрация: 22.09.2009
  • ICQ: --
  • Комментариев: 345
explOit,
всё тему прикрыли ) я новость отреактил ) щас всё в порядке ph34r

0

#16tlex

  • 8 февраля 2010 01:41
  • Регистрация: 9.10.2009
  • ICQ: --
  • Комментариев: 32
так кто нить может сделать, что б так же, тока сбоку

0

#17nsdss

  • 8 февраля 2010 07:53
  • Регистрация: 10.01.2010
  • ICQ: --
  • Комментариев: 457
Цитата: tlex
P.S. если у вас присутствует файл style.css заменять его не следует!

Уже есть на сайте, Сейчас промодерируют и будет. Почитаешь.

--------------------

0

#18ferno

  • 8 февраля 2010 19:17
  • Регистрация: 8.02.2010
  • ICQ: --
  • Комментариев: 15
Ставил, не понравилось! bo

--------------------

0

#19garri83

  • 9 февраля 2010 12:40
  • Регистрация: 27.11.2009
  • ICQ: --
  • Комментариев: 30
я давно такое видел мне понравилась и пользуюсь до сих пор

0

#20Zw1T

  • 9 февраля 2010 16:15
  • Регистрация: 4.02.2010
  • ICQ: 479187850
  • Комментариев: 47
Отличная весчЬ yahoo
А как моно вниз поставить ?

0
1 2
Предыдущая    Следующая
Информация
Посетители, находящиеся в группе Гости, не могут оставлять комментарии в данной новости.

Max-energy.top - Заработок на электросчетчиках;)

Skripters.info - все для вебмастера. Только эксклюзивный контент.

Создание шаблонов DLE, быстро и недорого! 3wave.com.ua

Бро лей на лучшую партнёрку

Почти бесплатный VDS хостинг!

Поддержи сайт
Скрипты, cms, шаблоны, статьи по раскрутке

Опросы

Как часто вы бываете на сайте?

Захожу 1-2 раза в день
1-2 часа в сутки
Более 2 часов
Почти целый день тут smile

Архив новостей
Ноябрь 2016 (7)
Октябрь 2016 (10)
Сентябрь 2016 (8)
Август 2016 (11)
Июль 2016 (14)
Июнь 2016 (17)

Последние комментарии:

Искать людей

Ваши переписки