Светло синие ajax окна DYG для uCoz
Безусловно это стильное по своему ajax-окон в светло синей гамме цвета, для тех веб мастеров, кто не перешел на новую систему. А таких посмотрю очень много, и вот для них окно, самым распространенный оттенком цвета, которое может подойти на любую тематику. Все очень просто сделано, вверх у него синий, а вот само ajax окно остальное в белом цвете. Немного сделано в 3D и также в таком же оттенке, только темнее кнопка отключить, которая форме куба. Можно по стилям сказать простое, так как содержит 2 основных ссылки, которые как раз отвечают за верх. Но если оно вам понравилось, но вот по гамме не идет на ресурс, то вы можете все изменить на фотошоп. Все функций идут с ним, но больше оно на сайте для красоты, и здесь больше похоже на модальное окно, которое на портал общий или совершенно другую тему подойдет и будет дополнять дизайн сайта. Рассмотрим 2 установки: 1) В CSS Код /* AJAX ============================================================================*/ .x-sh .xstl{padding-top:6px; background:none!important;} .x-sh .xsml{background:none!important;} .x-sh .xstr{padding-top:6px; background:none!important;} .x-sh .xsmr{background:none!important;} .x-sh .xsbl{padding-left:6px;background:none!important;} .x-sh .xsbc{background:none!important;} .x-sh .xsbr{padding-right:6px;background:none!important;} .xt {background:transparent url(http://zornet.ru/Ajaxoskrip/Aster/s_2.gif) no-repeat!important; margin-left:5px!important; margin-top:4px!important;} .xt-close{background-position:0 0!important;} .xt-close-over{background-position:-15px 0!important;} .xt-mini{background-position:0 -15px!important;} .xt-mini-over{background-position:-15px -15px!important;} .xt-maxi{background-position:0 -30px!important;} .xt-maxi-over{background-position:-15px -30px!important;} .xt-rest{background-position:0 -45px!important;} .xt-rest-over{background-position:-15px -45px!important;} .xw-tl {background:url(http://zornet.ru/Ajaxoskrip/Aster/ca86.png) repeat-y 0 0!important; padding-left:5px!important; -webkit-border-radius: 5px 0px 0px 0px; -moz-border-radius: 5px 0px 0px 0px; border-radius: 5px 0px 0px 0px;} .xw-tc {background:url(http://zornet.ru/Ajaxoskrip/Aster/s_1.gif) repeat-x 0 0!important; padding: 8px 10px 4px 10px!important;} .xw-tr {background:url(http://zornet.ru/Ajaxoskrip/Aster/ca86.png) repeat-y 100% 0!important; padding-right:5px!important; -webkit-border-radius: 0px 5px 0px 0px; -moz-border-radius: 0px 5px 0px 0px; border-radius: 0px 5px 0px 0px;} .xw-ml {background:url(http://zornet.ru/Ajaxoskrip/Aster/ca86.png) repeat-y 0 0!important; padding-left:5px!important;} .xw-mr {background:url(http://zornet.ru/Ajaxoskrip/Aster/ca86.png) repeat-y 100% 0!important; padding-right:5px!important;} .xw-bl {background:url(http://zornet.ru/Ajaxoskrip/Aster/ca86.png) no-repeat 0 100%!important; padding-left:5px!important; -webkit-border-radius: 0px 0px 0px 5px; -moz-border-radius: 0px 0px 0px 5px; border-radius: 0px 0px 0px 5px;} .xw-br {background:url(http://zornet.ru/Ajaxoskrip/Aster/ca86.png) no-repeat 100% 100%!important;padding-right:5px!important; -webkit-border-radius: 0px 0px 5px 0px; -moz-border-radius: 0px 0px 5px 0px; border-radius: 0px 0px 5px 0px;} .xw-bc {background:url(http://zornet.ru/Ajaxoskrip/Aster/ca86.png) repeat-x 0 100%!important; height:5px!important;} .xw-hdr-text {padding:0px!important;} .xw-hdr-text {font: 12px Verdana,Arial,Helvetica, sans-serif!important; color: #fff!important; text-shadow: 1px 1px 1px #000!important; line-height: 22px!important; vertical-align:2px!important;} .xw-plain .xw-mc {border: none!important; padding:0!important; margin:0!important; font: 11px Verdana,Arial,Helvetica, sans-serif!important; color:#444!important; background:#f9f9f9!important;} .xw-body {padding:0!important; margin:0!important; box-shadow:inset 0px 1px 3px #666; -webkit-box-shadow:inset 0px 1px 3px #666; -moz-box-shadow:inset 0px 1px 3px #666;} .xw-plain .xw-body{padding: 10px!important; border: none!important;} .xw-blank {background:#fff!important;} .myWinTD1 {background:none!important;} #nav-mid {} /*--------------------- Header end ---------------------*/ 2) Копируем и ставим вверх сайта в самый низ: Код <style type="text/css"> @import url('http://zornet.ru/Ajaxoskrip/Aster/Ajax-R3.css') all; </style> Вот вся установка, но если у вас до этого стояло дизайнерское окно, то вам нужно его убрать, а потом уже ставить новое. |
Поделиться в социальных сетях
Материал разместил
Комментарии: 7 | |
| |