Форма входа и регистраций для uCoz
 | |
| Это красивая кнопка входа для сайта, которая отвечает также за регистрацию.Что выполнена в двух оттенках цвета и подойдет на разную тематику. Вы можете сами в стилях изменить цвет если оттенок не подходит у вашему дизайн на сайте. Первая функция отвечает за вход на ресурс под своим логином, где при клике появится Ajax окно. Вторая функция будет отвечать за регистрацию, где при клике вы перейдете на эту страницу. Также нужно заметить, что под все клики установлены иконки и есть эффект при наведение клика. Все очень просто сделано и что главное, здесь еще можно сам стиль изменить, так он сделан под 3D, который можно убрать и к примеру закруглить углы, здесь уже сами можете выставить как вы считаете нужным для стилистике. Но и как кто то пройдет регистрацию или зайдет как пользователь, форма просто исчезнет, что можно ее поставить под мини профиль.  Ставим там где вам нужно: Код <?if($LOGIN_FORM$)?><div id="not-logged1"> <a href="javascript://" rel="nofollow" onclick="new _uWnd('LF', ' ', -250, -110, {autosize:1, closeonesc:1, resize:1 }, {url:'/index/40' } ); return false;">Войти</a> <a href="/register">Зарегистрироваться</a> </div><?endif?> Таблица стилей CSS: Код #not-logged1 { border-radius: 2px; overflow: hidden; background: #3498db; line-height: 38px; width: 272px; margin-left: 723px; margin-top: 20PX; position: absolute; } #not-logged1 a { display: block; float: left; color: #fffdfd; text-shadow: 0 1px 0 rgba(56, 56, 56, 0.75); padding: 0 18px 0 38px; transition: background 0.3s; } #not-logged1 a:nth-child(1) { border-bottom: 3px solid #3584b9; background: url(http://zornet.ru/Aben/ABGEA/Rin/retunga/logged.png) no-repeat 9px; } #not-logged1 a:nth-child(2) { background: #4c4c44 url(http://zornet.ru/Aben/ABGEA/Rin/retunga/reg.png) no-repeat 9px; border-bottom: 3px solid #31312f; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.75); border-top-left-radius: 3px; border-bottom-left-radius: 3px; } | |
Поделиться в социальных сетях
Материал разместил
| Комментарии: 7 | |
Вот можно ещё так оформить эту кнопочку и будет смотреться не хуже .
 Вот стили которые я немного подправил. Сам код не нужно менять просто стили заменить и всё. Код #not-logged1 {overflow: hidden; background: #3498db; line-height: 38px; width: 100%; -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.30); box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.30); border-bottom: solid #ccc; margin-bottom: 15px; border-radius: 50px;} #not-logged1 a {display: block; color: #fffdfd; text-shadow: 0 1px 0 rgba(56, 56, 56, 0.75); padding: 0 18px 0 38px; transition: background 0.3s;} #not-logged1 a:nth-child(1) {width: 30%; background: url(http://zornet.ru/Aben/ABGEA/Rin/retunga/logged.png) no-repeat 9px; float: left;} #not-logged1 a:nth-child(2) {width: 70%; float: right; background: #4c4c44 url(http://zornet.ru/Aben/ABGEA/Rin/retunga/reg.png) no-repeat 9px; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.75); border-radius: 50px 0 0 50px; padding: 0 0 0 37px;} | |
