Новые Ajax окна by7UARTS для uCoz

 Нравится (12)
 Все материалы
Категория Мои файлы
Добавил andruha061
Дата 15.06.2017

Новые Ajax окна by7UARTS для uCoz

Ajax-окна в системе uCoz используются практически везде, для авторизации, для просмотра репутации и наград, для кнопок загрузки материалов и так далее.

Стандартный вид данных окон после обновления uCoz выглядит довольно не плохо, но я думаю практически каждому хотелось бы украсить и сделать все по своему. В этом материале я подготовил для вас несколько расцветок для ajax-окон uCoz.

В интернете полно материалов связанных с Ajax окнами, и довольно много стилей, но после обновления uCoz большая часть из них перестала работать или отображается криво, поэтому я для вас подготовил стили для новых Ajax-окон uCoz.


И так, перейдем к установке :

1. Выбираем стиль который вам больше нравится или который подходит под ваш дизайн сайта.

2. Копируем код нужного стиля и вставляем в CSS-стили сайта через панель управления.

Стили :

1. Белый :

.xw-hdr-text {  
  vertical-align: 3px!important;  
  cursor: default!important;  
  color: #999 !important;  
  margin-left: 10px; }     
 .xt-maxi { display: none !important; }     
.xt-mini { display: none !important; } 
.xw-bc, .xw-mr, .xw-bl, .xw-br, .xw-ml, .xw-mc {  
  background: #fff !important;   /* ЦВЕТ ФОНА АJAX */ 
  border: 0 !important;  
  border-radius: 0px;  
  moz-border-radius: 0px;  
  webkit-border-radius: 3px; }     
.xw-body {  
  border: 0 !important;  
  padding-left: 7px !important;  
  padding-right: 1px !important; }     
.xw-tl { border-bottom: 1px solid #eee; }  /* ЦВЕТ ЛИНИИ МЕЖДУ ШАПКОЙ И СОДЕРЖИМЫМ АJAX */  
.xw-tl, .xw-tr, .xw-tc {  
  background: #FAFAFA !important; /* ЦВЕТ ФОНА ШАПКИ АJAX */  
  border-radius: 3px 3px 0 0 !important; }    
.xw-sps { display: none !important; }     
.myWinCont { width: 100% !important; }  
   
.xw-body {  
  border: 0 !important;  
  padding-left: 2px !important;  
  padding-right: 1px !important; }     
.xw-ml {  
  padding-left: 1px !important;  
  padding-bottom: 5px;  
  border-bottom-left-radius: 3px;  
  border-bottom-right-radius: 3px; }     
.xw-bl { display: none !important; }     
.myWinTD1 {  
  background: rgb(255, 255, 255) !important;  
  border-bottom: 1px solid rgb(250, 250, 250) !important; }         
   .myWinPollT {  
  background: rgb(243, 243, 243) !important;  
  float: left !important;  
  margin-right: 257px !important;  
  width: 100% !important; }     
.myWinPollG { display: none !important; }     
.myWinCont strong, b {     
  color: rgb(63, 63, 63) !important; }

2. Темный фон шапки и темно-голубой фон содержания :

.xw-hdr-text {  
  vertical-align: 3px!important;  
  cursor: default!important;  
  color: #ffffff !important;  
  margin-left: 10px; }     
 .xt-maxi { display: none !important; }     
.xt-mini { display: none !important; } 
.xw-bc, .xw-mr, .xw-bl, .xw-br, .xw-ml, .xw-mc {  
  background: #2980b9 !important;   /* ЦВЕТ ФОНА АJAX */ 
  border: 0 !important;  
  border-radius: 0px;  
  moz-border-radius: 0px;  
  webkit-border-radius: 3px; }     
.xw-body {  
  border: 0 !important;  
  padding-left: 7px !important;  
  padding-right: 1px !important; }     
.xw-tl { border-bottom: 1px solid #2980b9; } /* ЦВЕТ ЛИНИИ МЕЖДУ ШАПКОЙ И СОДЕРЖИМЫМ АJAX */      
.xw-tl, .xw-tr, .xw-tc {  
  background: #2c3e50 !important; /* ЦВЕТ ФОНА ШАПКИ АJAX */  
  border-radius: 3px 3px 0 0 !important; }    
.xw-sps { display: none !important; }     
.myWinCont { width: 100% !important; }  
   
.xw-body {  
  border: 0 !important;  
  padding-left: 2px !important;  
  padding-right: 1px !important; }     
.xw-ml {  
  padding-left: 1px !important;  
  padding-bottom: 5px;  
  border-bottom-left-radius: 3px;  
  border-bottom-right-radius: 3px; }     
.xw-bl { display: none !important; }     
.myWinTD1 {  
  background: rgb(255, 255, 255) !important;  
  border-bottom: 1px solid rgb(250, 250, 250) !important; }         
   .myWinPollT {  
  background: rgb(243, 243, 243) !important;  
  float: left !important;  
  margin-right: 257px !important;  
  width: 100% !important; }     
.myWinPollG { display: none !important; }     
.myWinCont strong, b {     
  color: rgb(63, 63, 63) !important; }    
.myWinCont, .myWinCont td, .myWinCont dl, .myWinCont dt { 
color: #fff; /* ЦВЕТ ТЕКСТА СОДЕРЖИМОГО АJAX */
} 

3. Серый :

.xw-hdr-text {  
  vertical-align: 3px!important;  
  cursor: default!important;  
  color: #ffffff !important;  
  margin-left: 10px; }     
 .xt-maxi { display: none !important; }     
.xt-mini { display: none !important; } 
.xw-bc, .xw-mr, .xw-bl, .xw-br, .xw-ml, .xw-mc {  
  background: #ecf0f1 !important;   /* ЦВЕТ ФОНА АJAX */ 
  border: 0 !important;  
  border-radius: 0px;  
  moz-border-radius: 0px;  
  webkit-border-radius: 3px; }     
.xw-body {  
  border: 0 !important;  
  padding-left: 7px !important;  
  padding-right: 1px !important; }     
.xw-tl { border-bottom: 1px solid #bdc3c7; }  /* ЦВЕТ ЛИНИИ МЕЖДУ ШАПКОЙ И СОДЕРЖИМЫМ АJAX */   
.xw-tl, .xw-tr, .xw-tc {  
  background: #bdc3c7 !important; /* ЦВЕТ ФОНА ШАПКИ АJAX */  
  border-radius: 3px 3px 0 0 !important; }    
.xw-sps { display: none !important; }     
.myWinCont { width: 100% !important; }  
   
.xw-body {  
  border: 0 !important;  
  padding-left: 2px !important;  
  padding-right: 1px !important; }     
.xw-ml {  
  padding-left: 1px !important;  
  padding-bottom: 5px;  
  border-bottom-left-radius: 3px;  
  border-bottom-right-radius: 3px; }     
.xw-bl { display: none !important; }     
.myWinTD1 {  
  background: rgb(255, 255, 255) !important;  
  border-bottom: 1px solid rgb(250, 250, 250) !important; }         
   .myWinPollT {  
  background: rgb(243, 243, 243) !important;  
  float: left !important;  
  margin-right: 257px !important;  
  width: 100% !important; }     
.myWinPollG { display: none !important; }     
.myWinCont strong, b {     
  color: rgb(63, 63, 63) !important; }    
.myWinCont, .myWinCont td, .myWinCont dl, .myWinCont dt { 
color: #bdc3c7;/* ЦВЕТ ТЕКСТА СОДЕРЖИМОГО АJAX */
} 

Если вам не подошли заготовленные стили, вы все можете настроить под себя. В коде указано где и для чего используется определенный цвет.
На этом у меня все. Спасибо за внимание.

7uarts, БЕСПЛАТНО, шаблон для ucoz


Всего комментариев: 1
avatar
0
1
проверка комментария
Войдите:
avatar