[spoiler="Скрин"][/spoiler]
Стильная полупрозрачная форма входа для вашего сайта. Будет просто замечательно смотреться на тёмных дизайнах
Установка:
После /head на нужных страницах вставляйте:
Код
<link href="/css/style.css" rel="stylesheet" />
<script type="text/javascript" src="/js/jquery.easing.1.3.js"></script>
<script language="javascript">
$(document).ready(function() {
$('#nav-bar').fadeIn();
$('#Log-in').click(function() {
$('#Log-in').css('background-color', '#006699');
$('#signUp').css('background-color', '#000000');
$('#submit').hide().css({'left' : '0px'});
$('#SignupForm').hide().css({'top' : '0px'});
$('#login').show().animate({
left : '52%',
},400,function(){
$('#login').css({'-webkit-transform' : 'rotate(-0deg)','-moz-transform' : 'rotate(-0deg)' });
});
///
$('#Login_form').show().animate({
top : '60px',
},700,function(){
//$('#image').css({'-webkit-transform' : 'rotate(-90deg)','-moz-transform' : 'rotate(-90deg)' });
});
});
$('#signUp').click(function() {
$('#signUp').css('background-color', '#006699');
$('#Log-in').css('background-color', '#000000');
$('#login').hide().css({'left' : '0px'});
$('#Login_form').hide().css({'top' : '0px'});
$('#submit').show().animate({
left : '52%',
},400,function(){
$('#submit').css({'-webkit-transform' : 'rotate(-0deg)','-moz-transform' : 'rotate(-0deg)' });
});
///
$('#SignupForm').show().animate({
top : '60px',
},700,function(){
//$('#image').css({'-webkit-transform' : 'rotate(-90deg)','-moz-transform' : 'rotate(-90deg)' });
});
});
});
</script>
Следующий код в то место, где будет сама форма входа и регистрации:
Код
<img src="/images/result.png" id="login" />
<img src="/images/submit.png" id="submit" />
<div class="loginform" id="Login_form">
<form method="post" action="#">
<div>
<div class="form-item">
<label for="edit-name">Логин:</label>
<input type="text" class="form-text required" value="" size="15" id="edit-name" name="name" maxlength="60">
</div>
<div class="form-item">
<label for="edit-pass">Пароль:</label>
<input type="password" class="form-text required" size="15" maxlength="60" id="edit-pass" name="pass">
</div>
</div>
</form>
</div>
<div class="loginform" id="SignupForm">
<form method="post" action="#">
<div>
<div class="form-item">
<label for="edit-name">Мыло:</label>
<input type="text" class="form-text required" value="" size="15" id="edit-name" name="name" maxlength="60">
</div>
<div class="form-item">
<label for="edit-name">Логин:</label>
<input type="text" class="form-text required" value="" size="15" id="edit-name" name="name" maxlength="60">
</div>
<div class="form-item">
<label for="edit-pass">Пароль:</label>
<input type="password" class="form-text required" size="15" maxlength="60" id="edit-pass" name="pass">
</div>
</div>
</form>
</div>
<div id="nav-bar">
<div class="module-bg">
<a href="#" class="TopButtons" id="Log-in">Войти</a>
<a href="#" class="TopButtons" id="signUp">Зарегистрироваться</a>
</div>
</div>
Сразу предупреждаю, что форма входа и форма регистрации не Ucoz'овские и адаптировать свои формы входа вам придётся самим.
Осталось лишь залить скрипт из прикреплённого архива в папку js, стиль в папку css и все картинки в папку images
Скачать
[admin]Если при нажатии на слово "Скачать"не началось скачивание то скопируйте ссылку ниже и вставьте в строку браузера! [/admin]
Код
http://gigabytes.clan.su/load-ucoz/skripts/vxod/1/1857_5en.rar