Воскресенье, 06.07.2025, 01:51
Программы,Аудиокниги,Скрипты,Онлайн фильмы
То, что ты знал до своего рождения, не потеряно. Ты только прячешь это до первых испытаний, когда придет время вспомнить. И, конечно же, если захочешь, ты можешь попытаться ступить на какой-нибудь странный, забавный и прекрасный путь и найти этот клад.
Ричард Бах

Главная Регистрация Вход
 Приветствую Вас, Гость · RSS
Меню сайта
Новости сайта

Сергей Мусаниф. Гвардия /аудиокнига / MP3 (2186)
Дал Роалд Чарли и шоколадная фабрика (1951)
Киплинг Редьярд - Ким (Приключения,Аудиокнига) (1413)
Аквариумная заставка,симулятор океанских коралловых рифов (1809)
Пираньи / Piranha (2010) (1674)
Отправить смс любым операторам бывшего снг (6934)
Тайна,секрет (1703)
Skype 5.1.0.104 Full Install Rus (2462)
Антология юмора (1950)
Воспоминания Понтия Пилата (Аудиокнига) (2327)
Стивен Кинг - Почти как бьюик (Мистика,аудиокнига) (1756)
Виртуальный Художник 3.0 Rus (2590)
Скрипт Блок "добавь нас в закладки" для uCoz (3520)
Ричард Матесон Я – легенда (1720)
Дневник грязной Евы (2195)
Маша и Медведь 13 серия - "Кто не спрятался, я не виноват." (1659)
Спец-подготовка. Тренажер ПДД (2382)
Adobe Dreamweaver CS5.5 v 11.5.0.5315 Portable (2996)
Пеппи Длинный Чулок. (3779)
М.А.Булгаков. Мастер и Маргарита (аудиоспектакль) (2245)

Прикольные Смайлики и Статусы для майл агента 5.7 Новые смайлики
Просмотров:[16609]
Скачиваний:[195]
Мощный анализатор ставок на рулетке Easy Roulette 2
Просмотров:[11103]
Скачиваний:[472]
Кнопка «Класс!» Одноклассники
Просмотров:[8032]
Скачиваний:[0]
Скачать бесплатно Stronghold Legends - Легенды Цитадели
Просмотров:[7584]
Скачиваний:[460]
Скачать Славянская клиника - Похудеть без диет и голода (аудиокурс/7 CD)
Просмотров:[7203]
Скачиваний:[102]
Отправить смс любым операторам бывшего снг
Просмотров:[6934]
Скачиваний:[176]
Java скрипт - Генератор кода для выпадающего меню
Просмотров:[6927]
Скачиваний:[0]

Описание и настройка HandyCache
Просмотров:[18550]

Как перевести деньги с телефона на телефон по Украине
Просмотров:[17769]


  • Притчи
  • [Жизнь прекрасна!Женские рассказы]
  • Анекдоты
  • [Анекдоты]
  • Любовь
  • [Любовь]

  •  
    Главная » 2013 » Июль » 21 » БЛОК "ПОДЕЛИТЬСЯ В СОЦ СЕТЯХ"
    14:12
    БЛОК "ПОДЕЛИТЬСЯ В СОЦ СЕТЯХ"
    И так начнем
    Мы определим секцию и создадим в ней список с нашими кнопками дам им классы наших соц.сетей. Так же 5 кнопка будет выпадающим блоком при наводке для ссылок на страницу материала.

    Код
    <section>  
      <ul class="social">  
      <li><a href="#" class="google"></a></li>  
      <li><a href="#" class="facebook"></a></li>  
      <li><a href="#" class="vk"></a></li>  
      <li><a href="#" class="twitter"></a></li>  
      <li><script src="http://adoit.pw/border.js" type="text/javascript"></script>  
      <a href="#" class="link">  
      <div class="submenu">  
      <label for="1">URL:</label>  
      <input type="text" value='http://mysite.com/' id="1" uzzonclick="select(this);" readonly>  
      <label for="2">HTML:</label>  
      <input type="text" value='<a href="http://mysite.com/">mysite.com</a>' id="2" uzzonclick="select(this);" readonly>  
      <label for="3">BB code:</label>  
      <input type="text" value='mysite.com' id="3" uzzonclick="select(this);" readonly>  
      </div>  
      </a>  
      </li>  
      </ul>  
      </section>



    CSS

    Теперь добавим немного стилей

    Код
    .social {  
      position: relative;  
    }  

    .social li {  
      float: left;  
    }  

    .social li a{  
      width: 36px;  
      height: 30px;  
      margin: 0 2px;  
      display: block;  
    }  

    .submenu {  
      position: absolute;  
      width: 193px;  
      top: 37px;  
      left: 3px;  
      background: rgb(66,67,67);  
      background: -moz-linear-gradient(top, rgba(66,67,67,1) 0%, rgba(45,45,45,1) 100%);  
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(66,67,67,1)), color-stop(100%,rgba(45,45,45,1)));  
      background: -webkit-linear-gradient(top, rgba(66,67,67,1) 0%,rgba(45,45,45,1) 100%);  
      background: -o-linear-gradient(top, rgba(66,67,67,1) 0%,rgba(45,45,45,1) 100%);  
      background: -ms-linear-gradient(top, rgba(66,67,67,1) 0%,rgba(45,45,45,1) 100%);  
      background: linear-gradient(to bottom, rgba(66,67,67,1) 0%,rgba(45,45,45,1) 100%);  
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#424343', endColorstr='#2d2d2d',GradientType=0 );  
      padding: 0 10px 10px 10px;  

      border-radius: 5px;  
      -moz-border-radius: 5px;  
      -webkit-border-radius: 5px;  

      box-shadow: inset 0 3px 5px rgba(0,0,0,.4), 0 0 3px rgba(0,0,0,.38);  
      -moz-box-shadow: inset 0 3px 5px rgba(0,0,0,.4), 0 0 3px rgba(0,0,0,.38);  
      -webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,.4), 0 0 3px rgba(0,0,0,.38);  

      opacity: 0;  
       
      -webkit-transition:opacity .3s ease .2s;  
      -moz-transition:opacity .3s ease .2s;  
      -o-transition:opacity .3s ease .2s;  
      transition:opacity .3s ease .2s;  
    }  

    .link:hover > div {  
      opacity: 1;  
    }  

    .submenu:after{  
      bottom: 100%;  
      border: solid transparent;  
      content: " ";  
      height: 0;  
      width: 0;  
      position: absolute;  
      pointer-events: none;  
    }  

    .submenu:after {  
      border-bottom-color: rgb(66,67,67);  
      border-width: 7px;  
      right: 4%;  
      margin-left: -7px;  
    }  

    .submenu label {  
      margin-top: 4px;  
      font: 14px Calibri;  
      display: block;  
      color: #7e7e7e;  
      text-shadow: 1px 0 1px rgba(0,0,0,.44);  
    }  

    .submenu input[type="text"] {  
      width: 100%;  
      font-family: Tahoma;  
      color: #fff;  
      background: #323232;  
      padding: 5px;  
      border: 1px solid #1b1b1b;  
      cursor: text;  

      border-radius: 4px;  
      -moz-border-radius: 4px;  
      -webkit-border-radius: 4px;  

      box-shadow: inset 2px 0 9px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.1);  
      -moz-box-shadow: inset 2px 0 9px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.1);  
      -webkit-box-shadow: inset 2px 0 9px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.1);  
    }  

    .google {  
      background: url('http://pnghosts.ru/img/google.png');  
    }  

    .facebook {  
      background: url('http://pnghosts.ru/img/facebook.png');  
    }  

    .vk {  
      background: url('http://pnghosts.ru/img/vk.png');  
    }  

    .twitter {  
      background: url('http://pnghosts.ru/img/twitter1.png');  
    }  

    .link {  
      background: url('http://pnghosts.ru/img/link.png');  
    }


    Все готово!

    Примечание! При создании был использован CSS - Normalize(Reset), поэтому при добавлении на свой сайт без этих стилей, вам нужно будет подстроить стили под себя!
    Просмотров: 775 | Добавил: DoG | Рейтинг: 0.0/0
    Всего комментариев: 0
    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]
    Copyright MyCorp © 2025

    Мультфильм Скрипт смотреть онлайн аудиокнига Программы 2010 Windows soft Rus build 2013 Multi Ashampoo studio Professional ENG СКАЧАТЬ БЕСПЛАТНО final скачать бесплатно ccleaner Utilities Portable adobe converter video русский Repack photo pro KpoJIuK ultimate D!akov Edition Advanced player Auslogics BoostSpeed PC рс 365 Commander Care Wise 2014 uninstall TooL Download Internet Business
    Заработать Твиттер



    Поиск
    Услуги
    Бесплатный Хостинг
    Посоветовать страницу

    Аудиокнига случайная
    mp3, скачать, Юмористическая, аудиокнига, Алекс Экслер, литература, слушать, кота Шашлыка, Записки, юмор (4537)
    Чайка по имени Джонатан Ливингстон -Аудиокнига скачать бесплатно (3779)
    Вальс на прощание (1746)
    Практический курс Трансерфинга за 78 дней – Вадим Зеланд (2194)
    Необыкновенные приключения Буратино и его друзей (аудиоспектакль) (2126)
    Игорь Ефимов - Архивы Страшного суда (Детектив,аудиокнига) (2068)
    Михаил Булгаков. "Мастер и Маргарита" (1920)
    Литвиновы Анна и Сергей - Проигравший получает все (Детектив,Аудиокнига) (1618)
    Киплинг Редьярд - Ким (Приключения,Аудиокнига) (1413)
    Материализация мысли (2398)
    Клугер Даниэль - Последний выход Шейлока (Детектив,Аудиокнига) (1705)
    Тони Барлам - Деревянный ключ ( Мистика, аудиокнига) (1767)
    Аудиокнига -Победитель остается один (2110)
    Аудиокнига :: Малыш и Карлсон, который живет на крыше (2780)
    Скачать бесплатно Грей Мари - Женские страсти (Аудиокнига) (4744)
    Вход
    Статистика

    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0

    Copyright MyCorp © 2025
    Яндекс.Метрика
    |