js jQuery Raty - Звездный рейтинг на JQuery 

Дата публикации  Дата изменения30.09.21  Комментарии6   Просмотры29447

Курсы

JQuery Raty генерирует настраиваемый звездный рейтинг автоматически.

Использование (значения по умолчанию):

 

$('div#star').raty({
  cancelHint:   'cancel this rate!',                             // Эта подсказка.
  cancelOff:    'cancel-off.png'                                 // Имя выключенного изображения.
  cancelOn:     'cancel-on.png'                                  // Имя включенного изображения.
  cancelPlace:  'left',                                          // Положение кнопки отмены.
  hintList:     ['bad', 'poor', 'regular', 'good', 'gorgeous'],  // Подсказка для 5-ти звезд по умолчанию.
  number:       5,                                               // Кол-во звезд.
  path:         'img,                                            // Путь к изображениям.
  readOnly:     false,                                           // Только для чтения или нет.
  scoreName:    'score',                                         // Имя намеченного показателя.
  showCancel:   false,                                           // Будет ли показана кнопка отмены рейтинга.
  showHalf:     false,                                           // Активация половинки звезды.
  starHalf:     'star-half.png',                                 // Картинка половинки звезды.
  start:        0,                                               // Отчет со значения.
  starOff:      'star-off.png',                                  // Имя выключенной звезды.
  starOn:       'star-on.png'                                    // Имя включенной звезды.
     //onClick:    function() { alert('clicked!'); }                // Здесь определяется функция по умолчанию.
 	});

Вставка:

<div id="star"></div>

$('#star').raty();
<div class="star"></div>
<div class="star"></div>
<div class="star"></div>
$('.star').raty();
Общие функции:
$.fn.raty.start(3);                                              // Начало рейтинга с трех последующих звезд.
   $.fn.raty.readOnly(true);                                        // Изменяет рейтинг в статус "только для чтения" для последующих звезд.
   $.fn.raty.click(2);                                              // Клик по последующей звезде.
 //Должно идти после текущего рейтинга и перед следующим. Потому как используется значение по последнему рейтингу.

Функции:

$('#star').raty('score');                   // получить текущий рейтинг

$('#star').raty('score', number); // установить рейтинг

$('#star').raty('click', number); // кликнуть на какую-нибудь звезду

$('.star').raty('readOnly', boolean); // Изменить состояние "только чтение"

$('#star').raty('cancel', boolean); // Отменить(закрыть) рейтинг. Последний параметр вызывает последний клик

$('#star').raty('reload'); // Перезагрузить рейтинг текущей конфигурацией

$('#star').raty('set', { option: value }); // Переустановить рейтинг по новой конфигурации

$('#star').raty('destroy'); // Разрушить связи и дать новый сырой рейтинг

В исходник также включена самая новая на день публикации статьи версия – jQuery Raty 2.4.5.

Источник

  Размер:  158,36kB | Изменен: 14.01.13 | Загрузок: 1075
Бесплатные курсы

Категории

Теги: , , , ,

Оцените материал:

Рейтинг: 7.0/10 (229)


КомментарииКомментарии:

    Влад

     

    А где хранится выставленный рейтинг?

    coder.hol.es /* Админ */

     

    Он не хранится – это только блок реализации самого рейтинга. Полные решения по рейтингу: _http://coderhs.com/archive/cssratajx, _http://coderhs.com/archive/unratajax

    Elena

     

    Здравствуйте! Как сделать так, чтобы этот рейтинг запускался по умолчанию, а не после нажатия на кнопку?

    coder hol es

     

    Здравствуйте! Варианты: http://coderhs.com/example/js/raty/

    Vladimir

     

    coder.hol.es/archive…, _http://coder.hol.es/archive/unratajax ошибка 404


 

Старые →← Новые