Всем привет! Есть меню с пятью ссылками, по этому меню бегает огонь (при нажатии на кнопку). Хочу сделать так, чтобы при нажатии на другую кнопку огонь останавливался. Вот код:
<!DOCTYPE html>
<html>
<head>
<title>jQuery</title>
<meta charset="utf-8" />
<script type="text/javascript" src="jquery-3.1.0.min.js"></script>
<script type="text/javascript">
var active = 0;
var links = false;
function parseDocument() {
if (!links) links = $("#menu a");
for (var i = 0; i < links.length; i++) {
if (i == active) links[i].style.color = "red";
else links[i].style.color = "blue";
}
if ((active + 1) == links.length) active = 0;
else active++;
setTimeout(parseDocument, 100);
}
function noparseDocument() {
}
function nob(nohide) {
var x = $("#nohide");
for (var i = 0; i < x.length; i++) {
x.get(i).style.display = 'inline';
}
}
function nod(nohide) {
var x = $("#nohide");
for (var i = 0; i < x.length; i++) {
x.get(i).style.display = 'none';
}
}
function ukrainestyle(blue) {
$('body').css("background", "url(images/ukraine.jpg)");
$('.ukr').css("display", "inline");
}
function deleteukraine(yellow) {
$('body').css("background", "white");
$('.ukr').css("display", "none");
}
function russianstyle(red) {
$('body').css("background", "url(images/russia.jpg)");
$('.rus').css("display", "inline");
}
function deleterussia(white) {
$('body').css("background", "white");
$('.rus').css("display", "none");
}
function usastyle(blue_white) {
$('body').css("background", "url(images/usa.jpg)");
$('.usa').css("display", "inline");
}
function deleteusa(red_white) {
$('body').css("background", "white");
$('.usa').css("display", "none");
}
</script>
<style>
img {display: none;}
#nohide {width: 477px;}
::-webkit-input-placeholder {color:#c0392b;}
</style>
</head>
<body>
<input type="button" name="delete_all" value="Создать Украину" class="blue" onclick="ukrainestyle()" />
<input type="button" name="nodelete_all" value="Удалить Украину" class="yellow" onclick="deleteukraine()" />
<input type="button" name="deleete_all" value="Создать Россию" class="red" onclick="russianstyle()" />
<input type="button" name="nodeelete_all" value="Удалить Россию" class="white" onclick="deleterussia()" />
<input type="button" name="deleeete_all" value="Создать США" class="blue_white" onclick="usastyle()" />
<input type="button" name="nodeeleete_all" value="Удалить США" class="red_white" onclick="deleteusa()" />
<input type="button" name="yeshide" value="Cкрыть форму" onclick="nod()" />
<input type="button" name="nohide" value="Показать форму" onclick="nob()" />
<br/>
<br/>
<input type="text" name="text" id="nohide" placeholder="Прежде чем создать Россию или США, удалите сначала Украину или наоборот" />
<br/>
<ul id="menu">
<li>
<a href="#">Ссылка 1</a>
</li>
<li>
<a href="#">Ссылка 2</a>
</li>
<li>
<a href="#">Ссылка 3</a>
</li>
<li>
<a href="#">Ссылка 4</a>
</li>
<li>
<a href="#">Ссылка 5</a>
</li>
</ul>
<input type="button" name="vkl" value="Включить огонь" onclick="parseDocument()" />
<input type="button" name="vikl" value="Выключить огонь" onclick="noparseDocument()" />
<br/>
<br/>
<img src="images/ukr.png" class="ukr" alt="" />
<img src="images/ukr.png" class="ukr" alt="" />
<img src="images/ukr.png" class="ukr" alt="" />
<img src="images/ukr.png" class="ukr" alt="" />
<img src="images/ukr.png" class="ukr" alt="" />
<img src="images/ukr.png" class="ukr" alt="" />
<img src="images/rus.png" class="rus" alt="" />
<img src="images/rus.png" class="rus" alt="" />
<img src="images/rus.png" class="rus" alt="" />
<img src="images/rus.png" class="rus" alt="" />
<img src="images/rus.png" class="rus" alt="" />
<img src="images/rus.png" class="rus" alt="" />
<img src="images/rus.png" class="rus" alt="" />
<img src="images/rus.png" class="rus" alt="" />
<img src="images/rus.png" class="rus" alt="" />
<img src="images/rus.png" class="rus" alt="" />
<img src="images/rus.png" class="rus" alt="" />
<img src="images/rus.png" class="rus" alt="" />
<img src="images/rus.png" class="rus" alt="" />
<img src="images/rus.png" class="rus" alt="" />
<img src="images/us.png" class="usa" alt="" />
<img src="images/us.png" class="usa" alt="" />
<img src="images/us.png" class="usa" alt="" />
<img src="images/us.png" class="usa" alt="" />
<img src="images/us.png" class="usa" alt="" />
<img src="images/us.png" class="usa" alt="" />
</body>
</html>