Модальные окна «VK» и «Одноклассники» by webo4ka


Модальные окна «VK» и «Одноклассники» by webo4ka

4840
8 из 10
Проголосовало: 19






Новые модальные окна «VK» и «Одноклассники» by webo4ka.ru для вашего сайта. Окна в основном подойдут для сайтов синего или оранжевого цвета, но кто захочет может поменять цвет на любой другой, это не составит особого труда и займет 5 сек)) Ну вообщем на скрине видно как выглядят данные окна, описывать тут нечего))

Установка:

1) Окна «Одноклассники»:

Вставляете куда вам надо:

Code
<a href="javascript://" onclick="otkritOdnoklassnikiWebo4kaRu();">открыть окно Одноклассники</a>

<div id="odnoklassnikiPositchiiOknaWebo4kaRu">
<div id="odnoklassnikiTitleWebo4kaRu"><p>Одноклассники</p></div>
<div id="odnoklassnikiKontentWebo4kaRu">
<div id="odnoklassnikiTextWebo4kaRu"><p>гуляю на webo4ka.ru</p></div>
</div>
<div id="odnoklassnikiNizWebo4kaRu">
<div id="odnoklassnikiButtonWebo4kaRu"><button onclick="zakritOdnoklassnikiWebo4kaRu();">Закрыть</button></div>
</div>
</div>
<style>
#odnoklassnikiPositchiiOknaWebo4kaRu {background: #fff; width: 610px; position: absolute; top:25%; left:25%; box-shadow: 0 0 8px #777; -moz-box-shadow: #777 0px 0px 25px; -webkit-box-shadow: #777 0px 0px 25px; box-shadow: #777 0px 0px 25px; z-index:999; display:none;}
#odnoklassnikiTitleWebo4kaRu{background: #ed812b; color: white; font-size: 15pt; padding: 5px 0px 5px 30px;}
#odnoklassnikiKontentWebo4kaRu {border-bottom: #888 solid 1px; padding:20px;}
#odnoklassnikiTextWebo4kaRu {background: #f6f7f6; border: #dbe0ea solid 1px; padding:10px; margin-bottom:10px;}
#odnoklassnikiNizWebo4kaRu {background: #f6f7f6; border-top: #dbe0ea solid 1px; padding: 10px; font-size: 12px; text-align: right;}
#odnoklassnikiButtonWebo4kaRu button {background-color: #ed812b; border-bottom-style: solid; border-left-style: solid; border-right-style: solid; border-top-style: solid; padding: 4px 14px; color: white; font-size: 11px; font-family: "tahoma"; margin: 0px; cursor: pointer;}
</style>
<script>
function otkritOdnoklassnikiWebo4kaRu(){$('#odnoklassnikiPositchiiOknaWebo4kaRu').fadeIn('slow'); $('body').css({'overflow':'hidden'});}
function zakritOdnoklassnikiWebo4kaRu(){$('#odnoklassnikiPositchiiOknaWebo4kaRu').fadeOut('slow'); $('body').css({'overflow':'auto'});}
</script>


2) Окна «VK»:

Вставляете куда вам надо:

Code
<a href="javascript://" onclick="otkritVKWebo4kaRu(); ">открыть окно VK</a>

<div id="vKPositchiiOknaWebo4kaRu">
<div id="vKTitleWebo4kaRu"><p>VK</p></div>
<div id="vKKontentWebo4kaRu">
<div id="vKTextWebo4kaRu"><p>гуляю на webo4ka.ru</p></div>
</div>
<div id="vKNizWebo4kaRu">
<div id="vKButtonWebo4kaRu"><button onclick="zakritVKWebo4kaRu();">Закрыть</button></div>
</div>
</div>
<style>
#vKPositchiiOknaWebo4kaRu {background: #fff; width: 610px; position: absolute; top:25%; left:25%; box-shadow: 0 0 8px #777; -moz-box-shadow: #777 0px 0px 25px; -webkit-box-shadow: #777 0px 0px 25px; box-shadow: #777 0px 0px 25px; z-index:999; display:none;}
#vKTitleWebo4kaRu{background: #5b7b9f; border: #43658a solid 1px; color: white; font-size: 15pt; padding: 5px 0px 5px 30px;}
#vKKontentWebo4kaRu {border-bottom: #888 solid 1px; padding:20px;}
#vKTextWebo4kaRu {background: #f6f7f6; border: #dbe0ea solid 1px; padding:10px; margin-bottom:10px;}
#vKNizWebo4kaRu {background: #f6f7f6; border-top: #dbe0ea solid 1px; padding: 10px; font-size: 12px; text-align: right;}
#vKButtonWebo4kaRu button {background-color: #6181a6; border-bottom-style: solid; border-left-style: solid; border-right-style: solid; border-top-style: solid; padding: 4px 14px; color: white; font-size: 11px; font-family: "tahoma"; margin: 0px; cursor: pointer;}
</style>
<script>
function otkritVKWebo4kaRu(){$('#vKPositchiiOknaWebo4kaRu').fadeIn('slow'); $('body').css({'overflow':'hidden'});}
function zakritVKWebo4kaRu(){$('#vKPositchiiOknaWebo4kaRu').fadeOut('slow'); $('body').css({'overflow':'auto'});}
</script>


готово!
Автор публикации: Загрузка
Загрузка
Вовчик, это его n материал
Источник: http://webo4ka.ru/
  • Всего комментариев: 11

denubil
0
denubil написал: Написано 03 Декабря 2012 в 03:21
Комментарий №11
я хочу поставить на страницу 2 окон и ничего не выходит тоесть текст из первой окне отоброжается во второй (( скажите пожалуста как зделать чтобы текст отличаться

DaMaGe
-3
DaMaGe написал: Написано 30 Ноября 2012 в 05:11
Комментарий №7
Херня полная

AndreyKlipikov
+1
AndreyKlipikov написал: Написано 01 Декабря 2012 в 10:44
Комментарий №8
+1, жду минусов) wink

Kelin
0
Kelin написал: Написано 01 Декабря 2012 в 13:44
Комментарий №9
+1

DaMaGe
0
DaMaGe написал: Написано 02 Декабря 2012 в 08:47
Комментарий №10
Да вы из деревни здесь все

BLAzER
0
BLAzER написал: Написано 28 Ноября 2012 в 11:07
Комментарий №3
Только попросить хотел, на скрине не очень смотрится сейчас поставлю посмотрю.

Winston888
0
Winston888 написал: Написано 28 Ноября 2012 в 05:50
Комментарий №2
Может лучше сделать такие ajax окна ?

SanyaSV
+4
SanyaSV написал: Написано 28 Ноября 2012 в 02:00
Комментарий №1
Красиво сделал Вовчик, просто красиво и со вкусом 5 баллов smile

alex0005
0
alex0005 написал: Написано 28 Ноября 2012 в 14:04
Комментарий №4
согласен

admin7553
0
admin7553 написал: Написано 28 Ноября 2012 в 19:15
Комментарий №5
Согласна, красиво смотрится. Только мне к дизайну не подходит dry

PheonixICQ
0
PheonixICQ написал: Написано 28 Ноября 2012 в 19:46
Комментарий №6
Дак ты под себя переделай тут все просто

  • Оставить комментарий:
Добавлять комментарии могут только зарегистрированные пользователи.
Регистрация | Вход
Меню сайта
Категории
Для помощи создания сайта uCoz 24
Скрипты и модификации для Ucoz 2101
Шаблоны форумов Ucoz 28
Шаблоны сайтов Ucoz 429
Авторство Webo4ki 309
php скрипты для ucoz 57
Графика для uCoz 40
Мини-чат
Последние комментарии
как поставить свою ссылку и логотип
  • Сатурн-1 написал:
  • Похвально.
  • Winston888 написал:
  • Я не говорил что делаю только скрипты. Я делаю шаблоны, скрипты, адаптации с разных движков под ucoz и на оборот + я ещё и сам рисую. В данный момент занимаюсь дизайном для webo4ka сам рисую сам верстаю.
  • Сатурн-1 написал:
  • Заметь, мы делаем почти одну и ту же работу.
    Ты - скрипты, я -шаблон. И каждый делает это бесплатно, НО
    ты делаешь скрипты без шаблона, я делаю шаблон без скриптов (не считая основных).
    Я тоже могу сказать что твои скрипты не идеальны, но не буду т.к. даже не знаю какие из всех существующих твои.
    Поэтому ты не сравнивай скрипты и шаблоны да еще и на Ucoz'e, мы же не на хакатоне каком нибудь.
  • Winston888 написал:
  • Если бы я не добавлял бесплатные адаптации или скрипты бесплатно я бы наверное не стал бы комментировать ваш материал.
    Последние темы
    Опрос
    403
    А
    Р
    Оцените новый дизай:)
    Статистика
    Анализ интернет сайта
    0
    онлайн
    0
    наших
    0
    чужих
    Онлайн всего: 6
    Гостей: 5
    Пользователей: 1
    0
    Сегодня были
    Топ пользователей: