Как изменить значение блока при разрешении меньше 700px??

Question

[Max]

Здравствуйте, есть слайдер, элименты в нем выводятся таким образом

<p data-position="10,50" data-step="0" data-out="left" data-in="right" class="slider_1"><? echo $m->text ?></a></p>

Нужно при разрешении экрана меньше 700 пикселей поставить в data-in="none". Вот так я пытаюсь к нему достучатся:

var myWidth = $(window).width();
 		console.log(myWidth);
 		var el = document.getElementsByClassName('slide');
 		console.log(el);
	if (myWidth < 700 ){
 		
	}

Answer 1

[Дима Паутов]

if (myWidth < 700 ){
$('.slider_1').data('in', 'none');
  }

Comments

[Max]

Ничего не меняется.

[Max]

В консоли null, если записать эту строчку в переменную и вывести ее.

[Дима Паутов]

Max: Может слайдер ваш динамически через js создается?

[Max]

Дима Турков: Хм.. На сколько я понимаю JS добавляет класс active-slide и тот слайд который отображается имеет уже не класс .slide а slide active-slide

[Дима Паутов]

Max: $('.slide.active-slide').data('in', 'none');

[Max]

Дима Турков: не работает(

Answer 2

[Пашенька]

var slider = document.getElementsByClassName('slider_1');
if (myWidth < 700 ){
    slider.setAttribute('data-in', 'none');
}

Answer 3

[Greg Popov]

Ну для начала, чтобы это было не только для одного раза, стоило бы его обернуть все в .bind(), и потом слушать как меняется сайт через .trigger()

После, можно вспомнить что data-in это атрибут. В jQuery есть .attr(), ну и дальше:
$(".elem").attr("data-in", val)

Comments

[Пашенька]

.bind() давно устарел.
Обернуть нужно в:

$(window).on('resize', function() {

});

[Greg Popov]

like-a-boss: когда я последний раз работал с этой библиотекой он еще ходил. Вылетело как-то.