Анимация полосы в опросах by webo4ka.ru


Анимация полосы в опросах by webo4ka.ru

383
10 из 10
Проголосовало: 11






Всем здрасти. И так, я открыл новую тему на форуме под названием: "Ваши идеи для создании скриптов...", и вот пользователь Soner, предложил идею скрипта:

Цитата Soner;63555
1. Анимированный вид опросов2. При ответе графики процентов плавно выходят (тоесть выезжают слева направо) было наподобие на сайте обзоров на лучшие сайты на юкозе


Мне идея понравилась, и я решил её выполнить. Скрипт делался для стандартного опроса. Суть его в том, что при ответе полосы рейтинга не просто будут появляться, а они будут медленно загружаться до своей точки, выглядит очень прикольно... Так же после того, как страница будет обновлена и пользователь просто будет видеть полосы без ответа, то они так же будут плавно полсти слева на право до своего места назначения, ну а теперь приступим к установке.

Установка:

Открываем Панель управления ---> Управление дизайном ---> Опросы ---> Вид формы опросов
и в самый низ вставляем данный код:

Код

<script type="text/javascript">  
  var number = ['1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20'];  
  for(var i = 0; i < number.length; i++){  
  $('div.answer div').eq(i).addClass('rating');  
  $('div.answer div div').eq(i).addClass('rating-'+[i]);  
  var width = $('.rating-'+[i]).width();  
  $('.rating-'+[i]).css('width', '0px');  
  $('.rating-'+[i]).animate({width:''+width+'px'},5000);  
  } /* by webo4ka.ru*/  
  </script>  

<style>  
  .rating {background: #f4f4f4 !important; overflow:hidden; margin:5px 0px 5px 0px; height:20px !important;}  
  div[class^="rating-"] {height:23px !important; overflow:hidden !important; margin-top:-3px; position:relative;}  
  .rating-0 {background:#bcdfff !important;}  
  .rating-1 {background:#febabb !important;}  
  .rating-2 {background: #fcd5b9 !important;}  
  .rating-3 {background: #fdbaf4 !important;}  
  .rating-4 {background: #b9ecfc !important;}  
  .rating-5 {background: #befeb9 !important;}  
  .rating-6 {background: #fffcba !important;}  
  .rating-7 {background: #fdb9bf !important;}  
  .rating-8 {background: #fbcdb8 !important;}  
  .rating-9 {background: #ddfdbb !important;}  
  .rating-10 {background: #fdbaf4 !important;}  
  .rating-11 {background: #fcfdb9 !important;}  
  .rating-12 {background: #fdbaba !important;}  
  .rating-13 {background: #b8ecfc !important;}  
  .rating-14 {background: #b6dafb !important;}  
  .rating-15 {background:#5d9ad3 !important;}  
  .rating-16 {background:#e96465 !important;}  
  .rating-17 {background:#f6954у !important;}  
  .rating-18 {background:#dd8cd2 !important;}  
  .rating-19 {background: #75d0ed!important;}  
  .rating-20 {background: #5bc254!important;}  
  </style>


На этом, все, будут новые предложения по скриптам, пишите в тему (ссылка выше).
Автор публикации: Загрузка
Загрузка
Вовчик, это его n материал
Источник: http://webo4ka.ru/
  • Всего комментариев: 6

Soner
0
Soner написал: Написано 20 Ноября 2015 в 21:16
Комментарий №6
все ГУД! Вовчик Красава!

Marishka
+2
Marishka написал: Написано 19 Ноября 2015 в 23:43
Комментарий №3
Код

<script type="text/javascript">  
  var number = ['1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20'];  
  for(var i = 0; i < number.length; i++){  
  $('div.answer div').eq(i).addClass('rating');  
  $('div.answer div div').eq(i).addClass('rating-'+[i]);  
  var width = $('.rating-'+[i]).width();  
  $('.rating-'+[i]).css('width', '0px');  
  $('.rating-'+[i]).animate({width:''+width+'px'},5000);  
  } /* by webo4ka.ru*/  
</script>  

Вовчик
0
Вовчик написал: Написано 19 Ноября 2015 в 23:46
Комментарий №4
блин, пиксили забыл дописать(( молодец что заметил smile

Marishka
0
Marishka написал: Написано 19 Ноября 2015 в 23:49
Комментарий №5
Бывает smile

Soner
0
Soner написал: Написано 18 Ноября 2015 в 22:56
Комментарий №1
чет не пашет, я уж и стандартный вид поставил

Вовчик
0
Вовчик написал: Написано 19 Ноября 2015 в 00:16
Комментарий №2
понял кося, постараюсь в ближайшее время исправить... p.s. если получится(

  • Оставить комментарий:
Добавлять комментарии могут только зарегистрированные пользователи.
Регистрация | Вход
Меню сайта
Категории
Для помощи создания сайта uCoz 24
Скрипты и модификации для Ucoz 2101
Шаблоны форумов Ucoz 28
Шаблоны сайтов Ucoz 429
Авторство Webo4ki 309
php скрипты для ucoz 57
Графика для uCoz 40
Мини-чат
Последние комментарии
Поставил ваш код он начинает считать от 0 до 100 и останавливаеться. я думал он будет в случайном порядке показывать цыфры
как поставить свою ссылку и логотип
  • Сатурн-1 написал:
  • Похвально.
  • Winston888 написал:
  • Я не говорил что делаю только скрипты. Я делаю шаблоны, скрипты, адаптации с разных движков под ucoz и на оборот + я ещё и сам рисую. В данный момент занимаюсь дизайном для webo4ka сам рисую сам верстаю.
  • Сатурн-1 написал:
  • Заметь, мы делаем почти одну и ту же работу.
    Ты - скрипты, я -шаблон. И каждый делает это бесплатно, НО
    ты делаешь скрипты без шаблона, я делаю шаблон без скриптов (не считая основных).
    Я тоже могу сказать что твои скрипты не идеальны, но не буду т.к. даже не знаю какие из всех существующих твои.
    Поэтому ты не сравнивай скрипты и шаблоны да еще и на Ucoz'e, мы же не на хакатоне каком нибудь.
    Последние темы
    Опрос
    204
    А
    Р
    Что произойдёт: $("#...
    Статистика
    Анализ интернет сайта
    0
    онлайн
    0
    наших
    0
    чужих
    Онлайн всего: 5
    Гостей: 4
    Пользователей: 1
    0
    Сегодня были
    Топ пользователей: