Сделайте Fivestar 7.x-2.2 мобильным

Я использую модуль Fivestar 2.2. Все работает отлично, но голосование на сенсорном экране - нет: невозможно присвоить 5 звезд на виджет 5 звезд, даже если он отлично работает на рабочем столе. К сожалению, я не могу предоставить ссылку.

Есть кто-то, кто уже решил это? Drupal.org это не помощь.

/**
* @file
*
* Fivestar JavaScript behaviors integration.
*/

/**
* Create a degradeable star rating interface out of a simple form structure.
*
* Originally based on the Star Rating jQuery plugin by Wil Stuckey:
* http://sandbox.wilstuckey.com/jquery-ratings/
*/
(function($){ // Create local scope.

Drupal.behaviors.fivestar = {
attach: function (context) {
$(context).find('div.fivestar-form-item').once('fivestar', function() {
  var $this = $(this);
  var $container = $('<div class="fivestar-widget clearfix"></div>');
  var $select = $('select', $this);

  // Setup the cancel button
  var $cancel = $('option[value="0"]', $this);
  if ($cancel.length) {
    $('<div class="cancel"><a href="#0" title="' + $cancel.text() + '">' + $cancel.text() + '</a></div>')
      .appendTo($container);
  }

  // Setup the rating buttons
  var $options = $('option', $this).not('[value="-"], [value="0"]');
  var index = -1;
  $options.each(function(i, element) {
    var classes = 'star-' + (i+1);
    classes += (i + 1) % 2 == 0 ? ' even' : ' odd';
    classes += i == 0 ? ' star-first' : '';
    classes += i + 1 == $options.length ? ' star-last' : '';
    $('<div class="star"><a href="#' + element.value + '" title="' + element.text + '">' + element.text + '</a></div>')
      .addClass(classes)
      .appendTo($container);
    if (element.value == $select.val()) {
      index = i + 1;
    }
  });

  if (index != -1) {
    $container.find('.star').slice(0, index).addClass('on');
  }
  $container.addClass('fivestar-widget-' + ($options.length));
  $container.find('a')
    .bind('click', $this, Drupal.behaviors.fivestar.rate)
    .bind('mouseover', $this, Drupal.behaviors.fivestar.hover);

  $container.bind('mouseover mouseout', $this, Drupal.behaviors.fivestar.hover);

  // Attach the new widget and hide the existing widget.
  $select.after($container).css('display', 'none');

  // Allow other modules to modify the widget.
  Drupal.attachBehaviors($this);
});
},
rate: function(event) {
var $this = $(this);
var $widget = event.data;
var value = this.hash.replace('#', '');
$('select', $widget).val(value).change();
var $this_star = (value == 0) ? $this.parent().parent().find('.star') : 
$this.closest('.star');
$this_star.prevAll('.star').andSelf().addClass('on');
$this_star.nextAll('.star').removeClass('on');
if(value==0){
  $this_star.removeClass('on');
}

event.preventDefault();
},
hover: function(event) {
var $this = $(this);
var $widget = event.data;
var $target = $(event.target);
var $stars = $('.star', $this);

if (event.type == 'mouseover') {
  var index = $stars.index($target.parent());
  $stars.each(function(i, element) {
    if (i <= index) {
      $(element).addClass('hover');
    } else {
      $(element).removeClass('hover');
    }
  });
} else {
  $stars.removeClass('hover');
}
}
};
})(jQuery);

1 ответ

Извините, если это не то, что вы просили, но я постараюсь помочь. Не используйте Fivestar, я был в такой же ситуации. Я предлагаю вам попробовать модуль оценки ( https://www.drupal.org/project/rate), который, на мой взгляд, является более полным решением.

У меня есть адаптивный веб-сайт, который, конечно, работает с мобильными устройствами, и вы можете голосовать без проблем, хотя я не могу гарантировать, что он был готов для мобильных устройств.

Другие вопросы по тегам