Чат uSite
Загрузка чата..
Все новости
Новости uSite
19.05.2012
Открыли «Оповещения» (β).
29.04.2012
Сделан до конца вид материалов форума.
Пользователи онлайн
Загрузка списка...
Уникальные дизайны » Части дизайна » Вид окон
Многие просили окна как в скрипте "Оставь своё мнение о нашем сайте". Вот решил сделать отдельное окно, и выложить сюда на сайт, думаю вам пригодится.

Вставляем в css

Code
.BackIdea {position:fixed; top:15%; left:0;; width:100%;}  
  .WrapIdea {color:#000; text-align:left; border:1px solid #fff; background:#fff; padding:75px; width: 460px; padding:5px; margin:0px auto 0px auto; -moz-box-shadow: 0px 0px 3px #888;-webkit-box-shadow: 0px 0px 3px #888;box-shadow: 0px 0px 3px #888; -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}  
  .headIdea {background:#5e86bc; color:#fff; padding:8px 10px 10px 10px; margin:7px -6px 7px -6px; text-shadow:1px 1px 0px rgba(0,0,0,0.40);}  
  #TextIdea {border:1px solid #3e5e8a; background:#fff; padding:3px; width:364px; font-size:11px; font-family:tahoma; color:#000; -webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}  
  #SubmitIdea {float:right; border:1px solid #3e5e8a; background-color:#4972a4; font:11px tahoma; font-weight:bold; color:#fff; padding:2px 5px 3px 5px; margin-left:5px; text-shadow:0px 1px 0px rgba(0,0,0,0.40) !important; -webkit-border-radius: 2px !important;-moz-border-radius: 2px !important;border-radius: 2px !important;}  
  #SubmitIdea:hover {background-color:#456d9e; cursor:pointer;}  
  #closeIdea {float:right; margin-top:-1px; cursor:pointer;}

Вставляем перед <body>:

Code
<div class="BackIdea" id="ajax1" style="display:none;"><div class="WrapIdea">  
<span style="color:#bbb; margin-top:-2px;"><span id="StatuSite">Название окна</span></span>  
<img onclick="$('.BackIdea').fadeOut();" id="closeIdea" src="http://demo.usite.su/img/close.png" border="0" />  
  <br>Содержимое окна
  </div></div>

И ставим ссылку для открытия окна где хотите:

Code
<a href="javascript://" onclick="$('#ajax1').fadeIn();">Открыть окно</a>

Мини FAQ
Если вы хотите сделать несколько окон изменяйте <div class="BackIdea" id="ajax1" style="display:none;"> например на <div class="BackIdea" id="ajax2" style="display:none;"> и в ссылке меняем <a href="javascript://" onclick="$('#ajax2').fadeIn();">Открыть окно2</a>

1 2 »
Всего 15 комментариев и 2357 просмотров
как сделать, чтобы окно по центру страницы было?
Гость
Скрипт просто улёт!
А где именно его использовать?
Всем привет, у меня вот возник такой вопрос. Как вызвать xml файл через данное окно?
себе поставил ) спасибо )
Гость
Вот бы еще затемнение сайта было, при открытии окна..
Могу для Вас сделать для AJAX, сделаю.
Гость
не очень окно, но оформелние кульное
uSite.su © 2010-2024
Все права защищены.
Лишь самые новые разработки для системы uCoz, среди которых находятся уникальные скрипты и великолепные части дизайна, совокупность которых порождает любимый многими сайт — uSite.su.
01RSS
Хостинг от uCozПользовательское соглашение и прочая информация