Показать сообщение отдельно
  #1 (permalink)  
Старый 06.12.2013, 13:47
Аватар для Klerikadm
Новичок на форуме
Отправить личное сообщение для Klerikadm Посмотреть профиль Найти все сообщения от Klerikadm
 
Регистрация: 25.11.2013
Сообщений: 7

Добавление и удаление класса по таймеру
Доброго времени суток уважаемые форумчане!

нужна ваша помощь, чтобы разобраться с кодом.

Суть такова, каждые 5 секунд скрипт кликает на ссылки (мне помогли его сделать тут Несколько событий click() последовательно). После этого, потребовалось доработать скрипт, чтобы он не только кликал каждые 5 секунд на ссылку но и добавлял к ней класс:

jQuery(document).ready(function ($) {
	    var links = $('a[href*=#]').get().reverse(),
	      len = links.length,
	      clickTimer = setInterval(function () {
		  
	        links[--len].click();
			$(links[len]).addClass('red');
	        len == 0 && clearTimeout(clickTimer);
	      }, 5000);
	});


Потом, потребовалось, чтобы этот класс через 4 секунды после добавления удалялся и я его реализовал с помощью добавления еще одного таймера. В итоге в списке появляется первый объект с классом ('red'), потом второй элемент с этим классом, а у предыдущего элемента остается еще старый класс

Для ясности картины прилагаю html и js

<!DOCTYPE html>
<html>
<head>
<title>Click</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="style/style.css" />
<script type="text/javascript" src="js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="js/click.js"></script>
<script type="text/javascript" src="js/intercept_links.js"></script>
</head>
<body>
<div>
	<ul class="left">
		
			<li><a href="#one">One</a></li>
			<li><a href="#one1">One1</a></li>
			<li><a href="#one2"><span id="click_2">One2</span></a></li>
			<li><a  href="#one3"><span id="click_1">One3</span></a</li>
			<li><a href="#one4">One4</a></li>
		
	</ul> 
</div>
	<div class="picture">
	<ul>
	<li><a name="one"><img src="img/001.jpg" alt="1" title="new"></a></li>
	<li><a name="one1"><img src="img/002.jpg" alt="1" title="new"></a></li>
	<li><a name="one2"><img src="img/003.jpg" alt="1" title="new"></a></li>
	<li><a name="one3"><img src="img/004.jpg" alt="1" title="new"></a></li>
	<li><a name="one4"><img src="img/005.jpg" alt="1"></a></li>
	</ul>
	</div>
	
	<script type="text/javascript">
	$(document).ready(function($){
	$('img[alt]').addClass('test').add('img[title]').addClass('test2')
	});
	</script>

</body>
</html>


jQuery(document).ready(function ($) {
	    var links = $('a[href*=#]').get().reverse(),
	      len = links.length,
	      clickTimer = setInterval(function () {
		  
	        links[--len].click();
			$(links[len]).addClass('red');
			clickTimer = setInterval(function () {
			$(links).removeClass('red');
			}, 9000);
	        len == 0 && clearTimeout(clickTimer);
	      }, 5000);
	});

Последний раз редактировалось Klerikadm, 06.12.2013 в 14:04.
Ответить с цитированием