Форум

Dogmat · #1 (**permalink**) 15.03.2016, 22:59

Добрый день! Ребята, подскажите пожалуйста в чем проблема. Использую плагин jquert.color-2.1.2. Задача такая: есть поле ячеек 10x10, часть ячеек периодически имеет неактивное состояние. По клику по такому полю оно меняет цвет от текущего к красному и обратно. Все бы ничего, но после этого при изменении css класса элемента, цвет его остается прежним из-за того, что в процессе анимации создается

style="background-color: rgb(142, 142, 142);"

Пробовал удалять и при помощи .css('background-color', '') и при помощи .removeAttr('style'), без результата. Это однозначно плагин не позволяет, чего делать-то?)

Код:

var this_cell = $(this);
var before_color = this_cell.css('backgroundColor');

this_cell.animate({backgroundColor: '#FF0000'}, 300);
this_cell.animate({backgroundColor: before_color}, 300);

рони · #2 (**permalink**) 16.03.2016, 01:53

Dogmat,
1. зачем нужен плагин ?
2. удалять атрибут надо и ставить класс

Сообщение от Dogmat

this_cell.animate({backgroundColor: before_color}, 300 ЗДЕСЬ);

Dogmat · #3 (**permalink**) 16.03.2016, 11:27

Спасибо, работает!

Плагин нужен, потому что без него jQuery не анимирует цвет, в консоль выпадает:
Ошибка при парсинге значения «background-color». Потерянное объявление.

рони · #4 (**permalink**) 16.03.2016, 12:34

Сообщение от Dogmat

потому что без него jQuery не анимирует цвет

может тогда jquery-ui

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  div{
      width: 408px;
     height: 30px;
     background-color: #00FF00;
  }
  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <script>
   $(function ()
{
    $('div').animate({
			backgroundColor:'#ff0000'
		},5000, function() {
      $(this).removeAttr("style")
});

})
  </script>
</head>

<body>

  <div></div>

</body>

</html>

Форум

Справочник

Discord чат

Курсы javascript