Общая статистика:
Всего пользователей: 58
Новых за месяц: 0
Новых за неделю: 0
Новых вчера: 0
Новых сегодня: 0
Пользователи онлайн
Онлайн всего: 1
Гостей: 1
Пользователей: 0
 




Indawo-Твой Любимой Форум ! Активные Пользователи , Адекватная Администрация , Множество денежных конкурсов , и все это только у нас !

Место Свободно

 
Стандартный background CS... Добавил: H4rd_Ran Дата: 06.03.2013
simple_wh_blocker.amxx, П... Добавил: -GM- Дата: 14.02.2013
bcd hudvoice timer (bcd_h... Добавил: -GM- Дата: 14.02.2013
Главная » Файлы » Все для uCoz » Скрипты для uCoz

Всплывающая форма входа для локальных пользователей uCoz
Шаг 1 - Установим JS
Для начала нам следует установить плагин Basic Modal Dialog, для этого вниз страницы перед закрывающим тегом </body> устанавливаем следующий js: 
Код
<script type="text/javascript" src="http://www.center-dm.ru/ucoz/forma_vxoda/4/simplemodal.js"></script>
Шаг 2 - Установим HTML
Теперь необходимо установить нужный html каркас формы входа для uCoz, для этого заходим в Админ панель => Дизайн => Управление дизайном => Пользователи => Форма входа пользователей 

удаляем старый код и устанавливаем новый
Код
<div class="vxod_error">$ERROR$</div>   
    
  <div class="vxod_name">Логин:</div><input class="vxod_pole" name="user" value="" size="20" maxlength="50" type="text">   
  <div class="vxod_name">Пароль:</div><input class="vxod_pole" name="password" size="20" maxlength="15" type="password">   

  <div class="vxod_zapomnit"><input id="rem$PAGE_ID$" type="checkbox" name="rem" value="1" checked="checked"/><label for="rem$PAGE_ID$">запомнить</label> </div>   
  <input class="vxod_kn" name="sbm" value="Войти" type="submit">   

  <div class="vxod_niz">   
  <a href="$REMINDER_LINK$">Забыл пароль</a> | <a href="$REGISTER_LINK$">Регистрация</a> 
</div>

Теперь нам следует установить основной каркас всплывающего окна с формой входя для uCoz, для этого вниз страницы перед закрывающим тегом </body> устанавливаем следующий код: 
Код
   
<div id="content_vxod" class="basic_content">   
  <div class="cv_title">Форма входа</div>   
  <div class="c_vxod">   
  $LOGIN_FORM$   
  </div>   
</div>   
а для того чтобы вызвать данное окно, в нужное место страницы установим ссылку: 
Код
<a href="#" id="okno_vxod">Вход</a>
Шаг 2 - Установим CSS
Код
/* Всплывающая форма входа для uCoz   
------------------------------------------*/   
#simplemodal-container {   
  width:400px;   
  height:250px;   
  background:#fff;   
  border:5px solid #A9C24E;   
  -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;   
}   

/* Тёмный фон при открытии окна*/   
#simplemodal-overlay {   
  cursor:wait;   
  background:#000;   
}   

/* Кнопка закрыть вверху окна */   
#simplemodal-container a.modalCloseImg {   
  top:-15px;   
  right:-14px;   
  width:23px;   
  height:23px;   
  z-index:3200;   
  display:inline;   
  cursor:pointer;   
  position:absolute;   
  background:url(http://www.center-dm.ru/ucoz/forma_vxoda/4/close.png) no-repeat;   
}   

#simplemodal-container a.modalCloseImg:hover {   
  background-position:0 -23px!important;   
}   

.basic_content {   
  display:none;   
}   

.cv_title {   
  float:left;   
  width:360px;   
  height:27px;   
  background:#f2f2f2;   
  margin-bottom: 10px;   
  padding: 8px 20px 0px 20px;   
  border-bottom: 1px solid #e9e9e9;   
  font:125%/1.5 Verdana,Arial,sans-serif; color:#728696; font-weight:700;   
}   

.c_vxod {   
  float:left;   
  width:280px;   
  margin: 20px 60px 0px 60px;   
}   

/* Основа формы входа   
------------------------------------------*/   
.vxod_error{   
  float:left;   
  width:100%;   
  color:red;   
  margin-bottom: 10px;   
  text-align:center;   
  font-weight: bold;   
}   

.vxod_name {   
  width:50px;   
  height:15px;   
  background: #8cd148;   
  padding: 5px 10px 5px 10px;   
  border: 1px solid #7ac035;   
  border-right:none;   
  color:#fff; text-shadow: 1px 1px 1px #427212; font-weight: bold;   
}   

.vxod_pole {   
  outline:none;   
  color:#666!important;   
  width:187px!important;   
  height:15px!important;   
  text-shadow: 1px 1px 1px #fff!important;   
  background:#f9f9f9!important;   
  border: 1px solid #CAD1DB!important;   
  padding: 5px 10px 5px 10px!important;   
}   
    
.vxod_name,   
.vxod_pole {   
  float:left;   
  margin: 0px 0px 10px 0px;   
  font:11px Verdana,Arial,Helvetica, sans-serif; font-weight: bold;   
}   
    
.vxod_pole:focus {   
  box-shadow:inset 0px 0px 3px #ccc!important;   
  -webkit-box-shadow:inset 0px 0px 3px #ccc!important;   
  -moz-box-shadow:inset 0px 0px 3px #ccc!important;   
}   
    
.vxod_zapomnit {   
  float:left;   
  margin-top: 5px;   
}   

.vxod_niz {   
  float:left;   
  width:100%;   
  color:#CAD1DB;   
  text-align:center;   
  font-weight: bold;   
  padding-top: 5px;   
  margin-top: 10px;   
  border-top: 1px solid #CAD1DB;   
}   

/* Зелёная кнопка входа   
------------------------------------------*/   
.vxod_kn {   
  float:right;   
  cursor:pointer;   
  padding: 5px 20px 5px 20px!important;   
  border:1px solid #72b837!important;   
  color:#236114!important; text-shadow:1px 1px 1px #d7ffb6!important;   
  background: #9aeb56!important;   
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #9aeb56), color-stop(1, #7ecb3d))!important;   
  background: -moz-linear-gradient(top, #9aeb56 1%, #7ecb3d 100%)!important;   
  background: -o-linear-gradient(#9aeb56, #7ecb3d)!important;   
}   

.vxod_kn:active {   
  box-shadow:inset 0px 0px 3px #5b9728!important;   
  -webkit-box-shadow:inset 0px 0px 3px #5b9728!important;   
  -moz-box-shadow:inset 0px 0px 3px #5b9728!important;   
}   

.vxod_kn:hover {   
  background:#aff278!important;   
}

Примечание
Не забудьте удалить старую форму входа uCoz, иначе данное решение будет оповещать вас о неправильно введённом логине или пароле, несмотря на то, что вы вводите их правильно. 

На этом всё, спасибо за внимание! 
  • Дата добавления: 24.02.2013
  • Всего комментариев: 0
    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]