ZorNet.Ru — сайт для вебмастера » Скрипты для uCoz » Красивое светлое окно Vk для uCoz

Красивое светлое окно Vk для uCoz

Красивое светлое окно Vk для uCoz
Это светлое окно как на сайте в контакте, которое появляется с материалом по клику. Что вы поставите в него, это надпись или изображение будет. Когда оно появиться, то по всем сторонам будет затемнение, вообщем с красивым эффектом. Вы можете сами, что вам нужно там выставить, это может быть новость сайта, или информация любая. Также идет второй код, это сам вызов, это уже сами ставите, чтоб было видно.

Красивое светлое окно для uCoz

В низ сайта:

Код
<div id="background" class="background" style="display:none;position:fixed;"></div>  
  <div id="avatar_view" class="back_photo_ajax" align="center" style="position:fixed;display:none;">  
  <style>  
  .back_photo_ajax {background: url('');width:100%;height:1100px;position:absolute;left: 0px;top: 0px;}  
  .background {background: url('http://zornet.ru/Ajaxoskrip/Fyrkes/Zret/31/photodlyafona.png');width:100%;height:100%;left: 0px;top: 0px;}  
  </style>  

  <div style="padding-top:12px;">  
  <div style="background-color: #ffffff;width: 100%; padding-right:15px;padding-top:1px; padding-left:15px; max-width:768px;">  
  <div id="close" style="float:left;padding-bottom:13px;padding-left:2px;padding-top:13px;"><font color="#2b587a"><b>Название окна</b></font></div><span style="float:right;padding-bottom:13px;padding-top:13px;"><font color="#2b587a"><a onclick="$('#avatar_view').toggle();$('#background').toggle();">Закрыть</a></font></span>  
  <div id="photopers" style="padding-bottom:70px; padding-top:70px;"><div id="phx"><div class="vfrphoto"> Содержимое окна </div></div></div>  
  </div>  
  </div>  
  </div>


Это нужно поставить там где хотите вызывать его.

Код
<a style="cursor:pointer;" onclick="$('#avatar_view').toggle();$('#background').toggle();">Открыть окно</a>


Как заметили, поставил логотип в него, но у вас все будет по умолчанию.
19 Января 2016 Просмотров: 1505 Комментариев: (15)

Поделиться в социальных сетях

Материал разместил

Оставь свой отзыв

Комментарии: 15
Kolinkor
Kolinkor 19 Января 2016 22:251
0
Очень нужное окно, еще можно под кнопку поставить выход и новости сайта прописывать.
Tergran
Tergran 19 Января 2016 22:272
0
Тут от в контакте, только светлый оттенок, да и закрыть наверное. Название пишем и ставим то что нужно, это может даже бы все что угодна, даже статистика сайта.
ucozmental
ucozmental 19 Января 2016 22:283
0
А меньше его нельзя сделать, то какое то широкое сразу появляется.
Kosten
Kosten 19 Января 2016 22:314
0
Думаю можно, там что в низ сайта ставите, найти width:100%;height:1100px и выставляем как нужно.
tsakonter
tsakonter 19 Января 2016 22:439
0
Но это же окно, оно и делается больше и меньше, если поставили, то сами можете просто изменить цифры.
ucozmental
ucozmental 19 Января 2016 22:335
0
Но там еще ссылки не хватает - background: url('') по идее должна быть.
Kosten
Kosten 19 Января 2016 22:346
0
Он так идет, если ширина не станет меньше или не чего не изменится, то там одна ссылка есть и после нее идет width:100%;height:100%; возможно здесь регулятор.
Сафрон
Сафрон 19 Января 2016 22:367
0
Не чего так, вообще отличное решение, что хочешь в него можно поставить, спасибо за скрипт.
Maryges
Maryges 19 Января 2016 22:388
0
Всегда такой код может пригодиться на сайте.
csretven
csretven 19 Января 2016 22:4910
0
На этот счет есть додальное окно, но это также не плохо смотрится.
ucozmental
ucozmental 19 Января 2016 22:5211
0
Наверно модальное окно, но думаю вы ошиблись, да есть и можно найти, но что то лучше поставить понятное, как это.
1 2 »
avatar