» »

Споилера для uCoz пять видов


Споилера для uCoz пять видов

Если кто хочет на сайте обновить свой спойлер то вам предлагаю 5 видов. Возможно вы подберете себе на интернет ресурс под ваш дизайн сайта. Они выглядят как полоса с крестиком, думаю вы такие видели на других системах. Теперь можно сделать на вашем сайте а точнее на ucoz. Все просто, нужно выбрать цвет и просто прописать стиль в ваш CSS. И все больше не чего не нужно делать, все поменяется автоматически.
И сразу увидите что немного сам дизайн поменяется на вашем портале, так как кнопки просто смотрятся великолепно и подойдут под любую тематику.
Установка:

Оранжевый вариант:

Код
/*Spoiler weban*/  
  .uSpoilerButton, #uSpoilerFvcDtt {width: 100%; text-align: left;padding:5px;font-size:11px;  
font-weight:bold;background: #FFCA32;  
text-shadow:0px 1px 0px #FFE73F;border:1px  
  solid #E89512;box-shadow:0px 1px 0px rgba(255,255,255,0.4)  
inset;-moz-box-shadow:0px 1px 0px rgba(255,255,255,0.4)  
inset;-webkit-box-shadow:0px 1px 0px rgba(255,255,255,0.4) inset}.scriptcode{color:#B02C20;  
text-align:left;max-height:300px;overflow:auto;font-family:"Courier New"}  
.title_spoiler{font-weight:bold;font-size:11px;text-shadow:0px 1px 0px #fff}  
.title_spoiler a, .title_spoiler a:hover{color:#000}  
   
  .uSpoilerText {padding:5px;font-size:11px;background:#F9F8F5;border:1px  
  solid #F1EEE8}  
  /*--------------------------------*/

Синий вариант:

Код
/*Spoiler webanf*/  
  .uSpoilerButton, #uSpoilerFvcDtt {width: 100%; text-align: left;padding:5px;font-size:11px;  
font-weight:bold;background: #4D64FF;  
text-shadow:0px 1px 0px #4D64FF;border:1px  
  solid #E89512;box-shadow:0px 1px 0px rgba(255,255,255,0.4)  
inset;-moz-box-shadow:0px 1px 0px rgba(255,255,255,0.4)  
inset;-webkit-box-shadow:0px 1px 0px rgba(255,255,255,0.4) inset}.scriptcode{color:#B02C20;  
text-align:left;max-height:300px;overflow:auto;font-family:"Courier New"}  
.title_spoiler{font-weight:bold;font-size:11px;text-shadow:0px 1px 0px #fff}  
.title_spoiler a, .title_spoiler a:hover{color:#000}  
   
  .uSpoilerText {padding:5px;font-size:11px;background:#F9F8F5;border:1px  
  solid #F1EEE8}  
  /*--------------------------------*/

Зеленый вариант:

Код
/*Spoiler weban*/  
  .uSpoilerButton, #uSpoilerFvcDtt {width: 100%; text-align: left;padding:5px;font-size:11px;  
font-weight:bold;background: #5EFF94;  
text-shadow:0px 1px 0px #5EFF94;border:1px  
  solid #E89512;box-shadow:0px 1px 0px rgba(255,255,255,0.4)  
inset;-moz-box-shadow:0px 1px 0px rgba(255,255,255,0.4)  
inset;-webkit-box-shadow:0px 1px 0px rgba(255,255,255,0.4) inset}.scriptcode{color:#B02C20;  
text-align:left;max-height:300px;overflow:auto;font-family:"Courier New"}  
.title_spoiler{font-weight:bold;font-size:11px;text-shadow:0px 1px 0px #fff}  
.title_spoiler a, .title_spoiler a:hover{color:#000}  
   
  .uSpoilerText {padding:5px;font-size:11px;background:#F9F8F5;border:1px  
  solid #F1EEE8}  
  /*--------------------------------*/

Белый вариант:

Код
/*Spoiler weban*/  
  .uSpoilerButton, #uSpoilerFvcDtt {width: 100%; text-align: left;padding:5px;font-size:11px;  
font-weight:bold;background: #FFFDFC;  
text-shadow:0px 1px 0px #FFFDFC;border:1px  
  solid #E89512;box-shadow:0px 1px 0px rgba(255,255,255,0.4)  
inset;-moz-box-shadow:0px 1px 0px rgba(255,255,255,0.4)  
inset;-webkit-box-shadow:0px 1px 0px rgba(255,255,255,0.4) inset}.scriptcode{color:#B02C20;  
text-align:left;max-height:300px;overflow:auto;font-family:"Courier New"}  
.title_spoiler{font-weight:bold;font-size:11px;text-shadow:0px 1px 0px #fff}  
.title_spoiler a, .title_spoiler a:hover{color:#000}  
   
  .uSpoilerText {padding:5px;font-size:11px;background:#F9F8F5;border:1px  
  solid #F1EEE8}  
  /*--------------------------------*/

Красный вариант:

Код
/*Spoiler webanf*/
.uSpoilerButton, #uSpoilerFvcDtt {width: 100%; text-align: left;padding:5px;font-size:11px;
font-weight:bold;background: #FF2C14;
text-shadow:0px 1px 0px #FF2C14;border:1px
solid #E89512;box-shadow:0px 1px 0px rgba(255,255,255,0.4)
inset;-moz-box-shadow:0px 1px 0px rgba(255,255,255,0.4)
inset;-webkit-box-shadow:0px 1px 0px rgba(255,255,255,0.4) inset}.scriptcode{color:#B02C20;
text-align:left;max-height:300px;overflow:auto;font-family:"Courier New"}
.title_spoiler{font-weight:bold;font-size:11px;text-shadow:0px 1px 0px #fff}
.title_spoiler a, .title_spoiler a:hover{color:#000}

.uSpoilerText {padding:5px;font-size:11px;background:#F9F8F5;border:1px
solid #F1EEE8}
/*--------------------------------*/

Очень хорошая подборка.
18.12.2013 Просмотров: 736 Комментарий: (2)

Поделиться в социальных сетях

Материал разместил

Комментарий: 2
qwertasd
qwertasd 18.12.2013 01:261
0
Не ну кнопка по прикольней, вот её я бы перекрасил.
Kosten
Kosten 18.12.2013 01:352
0
qwertasd, стили есть. Можно и попробовать, так как не одной ссылки нет.
avatar