Перенести класс css из html в js в рабочем скрипте

[mrtdiesel]

Кнопка с анимацией при скролле:
<a href="#" class="toanimate" data-animation="tada">КНОПКА</a>
Где toanimate - класс который меняет js на animated, (анимация css без js работает так: animated tada)
а data-animation="tada" вид анимации, его и надо засунуть в js чтобы менять tada уже в самом js.

blockToAnimate.each(function(){		
			if(jQuery(this).offset().top < (jQuery(window).scrollTop() + jQuery(window).outerHeight()) && jQuery(this).offset().top + jQuery(this).outerHeight() > (jQuery(window).scrollTop() ) ) {
				if (!jQuery(this).hasClass("animated")) { 
					jQuery(this).addClass("animated"); 					
					animation_type = jQuery(this).data('animation');
					jQuery(this).addClass(animation_type); 
					} 				
			} else {
				jQuery(this).removeClass("animated"); //jQuery(this).trigger('animateOut');
				animation_type = jQuery(this).data('animation');
				jQuery(this).removeClass(animation_type); 
			}
	});

Буду признателен за помощь

[kostyanet]

Оно уже засунуто, ну и дальше-то что?

[mrtdiesel]

Возможно я не правильно выразился
Нужно сократить ссылку:

<a href="#" class="toanimate" data-animation="tada">КНОПКА</a>

До вида:

<a href="#" class="toanimate">КНОПКА</a>

Тип анимации (data-animation="tada") указывать уже в js.

[mrtdiesel]

Ну или сделать так, что бы ссылка была с двумя классами подряд:
Вместо:

<a href="#" class="toanimate" data-animation="tada">КНОПКА</a>

Сделать:

<a href="#" class="toanimate tada>КНОПКА</a>

Но что бы js смог обрабатывать это.

[AntonMs]

jQuery -

$("елемент").removeAttr("data-animation")

JavaScript -

елемент.removeAttribute("data-animation")

Это удаления атрибута

[kostyanet]

Я ничего все равно не понял, кроме одного - автор знает что надо сделать, что на что поменять, какие строки на какие и все такое - но хочет чтобы это сделали за него?

[mrtdiesel]

Извиняюсь что не понятно выражаю мысль. Попробую иначе.
Я не знаю пока что поменять в js. Но убрав в хтмл data-animation="tada"
необходимо что бы функциональность обьектов, в данном случае ссылок сохранилась (те можно было менять тип анимации уже в самом js.

[Deff]

mrtdiesel,

1. Зачем убирать ?
2. Если значение для всех объектов идентично, - то да - перенести эту переменную в скрипт - логично,
если различно и не имеет неизменного алгоритма применительно к селекторам объектов - перенос нелогичен
3. Приведите все возможные варианты анимаций и их параметры (или алгоритм)
Я не понял что означает tada или чтобы менять tada уже в самом js.
Оно как-то связано с цифровым значением ?
4. Приведите стиль текущей анимации на css (Для нескольких вариантов tada и т.д.)

[mrtdiesel]

1. Когда в хтмл будет только 1 или 2 класса, без дополнительных типов, ковычек - проще, во всяком случае мне
2. Необходимо менять переменную (в данном случае "tada" на другие уже в js, руками по желанию, а не по алгоритму.
3. "Tada" - 1 из видов анимации. При подключенном внешнем css файле работает так: class="animated tada;"
Все возможные варианты анимации с сайта animate.css
4. "tada" - вид анимации. И работал бы в кнопке БЕЗ js в таком виде:

<a href="#" class="animated tada">КНОПКА</a>

, но для управления анимацией через js приходится стоку писать уже с большим кол-вом слов + заключать тип анимации "tada" в ковычки (чего я не хочу делать если перенести смену типа анимации в код js, который, например, можно положить на внешний сервер).

<a href="#" class="toanimate" data-animation="tada">КНОПКА</a>

, и js уже ищет и меняет класс animate на правильный - animated и подставляет переменную, которую как раз и нужно менять не в хтмл а js.
В общем надо управлять типом анимации в js. Так будет понятнее а уж попутно решится моя проблема - хтмл строка уменьшится после переноса типа анимации в js))

[mrtdiesel]

Ок - завтра гляну

Спасибо.
А зачем типы анимации нужны в js? Они и так все указаны в файле css что скачивается с сайта
Но все равно сделал. В строчку и столбик.
хтмл можно будет таким писать?

<a href="#" class="toanimate tada">КНОПКА</a>

или еще лучше таким?

<a href="#" class="toanimate">КНОПКА</a>

Только не привязывайте поиск классов только к ссылкам. Хочется использовать анимацию не только к тегу "a", а к любым обьектам.