Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Не корректно работают элементы jQuery (https://javascript.ru/forum/misc/73516-ne-korrektno-rabotayut-ehlementy-jquery.html)

Mr. Stil 22.04.2018 08:13

Не корректно работают элементы jQuery
 
Доброго дня всем читающим!
Задача такая:
Необходимо реализовать разные стили для вида материалов на сайте.

Решение:
Искал решение в инете, нашёл вот такой код
$("div.blockn1:odd").removeClass("blockn1").addClass("blockn2");


У ютубера данный код работает без проблем, в моём случае нет.
Проблема:
Ситуация состоит в том, что элементы проверки на чётность/нечётность в jQuery - "even, odd" непонятным образом отказываются работать правильно, а именно:
Вариант 1: меняется стиль только у 1 материала, либо у последнего;
Вариант 2: меняются стили у 1-ой и последней новости (или на оборот смена только между 1-ой и 5-ой, т.к. всего 5);
Вариант 3: не работает вовсе.
Подключал библиотеку jQuery, пробовал реализацию через CSS (nth-child(even)) - не сработало
Для того чтобы было проще понять проблему вот сайт http://videoobzori.ucoz.net

Прошу помочь, если это возможно.:)
P.S. Дизайн сайта ещё в разработке, так что не обессудьте. Все материалы тестовые, чтобы убедиться в корректной работе внешнего вида

j0hnik 22.04.2018 08:57

<style>
		div.blockn1:nth-child(even){
			color: red;
		}
	</style>

	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>


прежде чем пробовать на CSS удалите код JQuery он меняет классы из за этого у вас такие эффекты и возникают.

<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
	<style>
		div.blockn1:nth-child(even){
			color: red;
		}
	</style>

	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>
	<div class="blockn1">4324324234234</div>

	<script>

$("div.blockn1:odd").removeClass("blockn1").addClass("blockn2");

	</script>

Mr. Stil 22.04.2018 12:17

j0hnik, спасибо за ответ! всё работает (кроме скрипта), вне системы uCoz.
CSS отрабатывает хорошо и как надо, однако скрипт так и не работает:(


Часовой пояс GMT +3, время: 19:00.