Красивый и современный вид опросов в стиле Flat для uCoz
827материалов
228тем на форуме
3003комментария
6152пользователя

Красивый и современный вид опросов в стиле Flat для uCoz


Описание:

Хотелось бы представить вам красивый и достаточно интересный вид опроса для сайта 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;           
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;           
}

ЗАКАЗАТЬ УСТАНОВКУ

Скрипт опубликовал:
...
Логин на сайте: ...
Группа: ...
Статус: ...
Информация о скрипте:
Дата добавления материала: 23.09.2015 в 17:00
Материал просмотрен: 1494 раза
Категория материала: Скрипты для uCoz
К материалу оставлены: 4 комментария

Пожаловаться
Сказать спасибо

4 комментария


Albina-Danes
Отлично. Беру.
Бармен
Красиво выглядит.
Roman
Роман Сергеев @Roman 26.06.2015 00:553
+2
Отлично, мне нравится.
FeerNoom
VLADIMIR @FeerNoom 28.06.2015 02:494
+2
Отлично!!  wink
avatar
Вход через социальные сети
Работа в компании uCoz
uSocial - социальные кнопки
uLike – кнопка «Мне нравится»
Статистики нашего сайта