• Страница 1 из 1
  • 1
Форум Сталкер » Web-раздел » Скачать скрипты для сталкера » Красивый и современный вид опрос в стиле Flat для uCoz
Красивый и современный вид опрос в стиле Flat для uCoz
XemorDioДата: Понедельник, 04.04.2016, 12:42 | Сообщение # 1
Генерал-полковник
Группа: Пользователи
Сообщений: 897
Награды: 7
Репутация: 8
Статус: Offline

Хотелось бы представить вам красивый и достаточно интересный вид опроса для сайта ucoz.

Такой вид опроса улучшит дизайн вашего сайта в целом. Так как он выполнен очень стильно и элегантно. Этот вид опроса будет являться прекрасной заменой стандартного дизайна опросов ucoz.

В вид формы опросов вставляем код:
Код
<div class="pollBlock">     
<div class="titles" style="text-align: center;">$QUESTION$</div>     
<div class="pollAns">$ANSWERS$</div>  
<center>     
<a id="arch" class="button_poll arhiv_rez_poll" href="$ARCHIVE_LINK$">Архив</a>     
<a id="resLink" class="button_poll arhiv_rez_poll" href="$RESULTS_LINK$">Результат</a>     
</center>     
<div class="pollTot">Всего ответов: <b>$TOTAL_VOTES$</b></div>     
</div>     

<script type="text/javascript">     
var a = ['1','2','3','4','5','6','7','8','9','10','11','12','13','14','15'];     
for(var i = 0; i < a.length; i++){$('div.answer div').eq(i).addClass('progress');$('div.answer div div').eq(i).addClass('progress-'+[i]);}     
$('div.answer span').each(function(){$(this).html($(this).html()+' - <span class="procent">'+$(this).attr('title').split(':')[1]+'</span>')});     
</script>     
<script>     
     $(function () {     
if($('.pollBut').size() > 0) {     
$('#arch, #resLink').hide();     
}     
})     
</script>


В css Вашего сайта вставляем код:
Код
.progress {     
     height: 15px;     
     overflow: hidden;     
     margin: 5px 0px 5px 0px;     
     height: 15px!important;     
     background: #F4F8F9!important;     
}     

.progress-0,     
.progress-1,     
.progress-2,     
.progress-3,     
.progress-4,     
.progress-5,     
.progress-6,     
.progress-7,     
.progress-8,     
.progress-9,     
.progress-10,     
.progress-11,     
.progress-12,     
.progress-13,     
.progress-14 {     
     height: 18px!important;     
     display: block!important;     
     overflow: hidden!important;     
     margin-top: -3px;     
}     

.progress-0 {background: #5D9AD3!important;}     
.progress-1 {background: #E96465!important;}     
.progress-2 {background: #F6954E!important;}     
.progress-3 {background: #dd8cd2!important;}     
.progress-4 {background: #75D0ED!important;}     
.progress-5 {background: #5BC254!important;}     
.progress-6 {background: #CFC72D!important;}     
.progress-7 {background: #DD3344!important;}     
.progress-8 {background: #FE9B6F!important;}     
.progress-9 {background: #8CC84B!important;}     
.progress-10 {background: #DD8CD2!important;}     
.progress-11 {background: #e9eb5b!important;}     
.progress-12 {background: #E96465!important;}     
.progress-13 {background: #75D0ED!important;}     
.progress-14 {background: #5D9AD3!important;}     
     .answer {     
color: black;     
background-image: none;     
background-repeat: no-repeat;     
background-position: bottom left;     
line-height: 22px;&nnbsp;    
display: block;     
text-align: left;  
font-size: 11px;  
}     
     .pollAns {margin: 0 3px 4px 3px;padding: 5px;text-align: center!important;}     
     .titles {display: block;-moz-border-radius: 3px;-webkit-border-radius: 3px;-khtml-border-radius: 3px; border-radius: 3px;background: #22A5DC;color: white;text-shadow: 0 1px 0 #22A5DC;padding: 4px 5px 5px 5px;font-size: 13px;  
}  

.button_poll {  
     cursor:pointer;  
     text-decoration:none!important;  
     display:inline-block;  
     font-size: 13px;  
     margin:0 10px 20px 0;  
     padding: 7px 11px 7px;  
     position:relative;  
     outline:none;  
     border:none;  
         
     -webkit-transition:all 0.2s linear;  
     -moz-transition:all 0.2s linear;  
     -o-transition:all 0.2s linear;  
     transition:all 0.2s linear;     
}  
.arhiv_rez_poll {  
     background:#3C75CE;  
     color: #fff;  
}  
.arhiv_rez_poll:hover {  
     background:#2859A3;  
     color:#fff;  
}  
.pollTot {  
border: 0;  
background:#006EEE;  
color: #fff;  
font-size: 13px;  
padding: 5px 10px;  
margin-top: 0px;  
text-align:center;     
}


Если пользователь еще не проголосовал:

 
Форум Сталкер » Web-раздел » Скачать скрипты для сталкера » Красивый и современный вид опрос в стиле Flat для uCoz
  • Страница 1 из 1
  • 1
Поиск:
Поделись с другими сталкерами
Меню сайта
Гость
Статистика
Рейтинг@Mail.ru