@Elena_7
начинающий веб-программист

Как исправить частично работающее условие?

Если закомментировать второе условие, цвет третьего бокса меняется на синий. Если второе условие снова открыть: при первом клике меняются параметры 1 и 2 боксов, цвет третьего на синий не меняется (а по идее должен). При втором клике все работает: параметры всех боксов возвращаются к исходным. Почему так происходит? Как сделать, чтобы цвет менялся на синий в третьем боксе при первом клике. И еще, как сделать, чтобы цикл повторялся? Сейчас он после второго клика и возврата к стартовым характеристикам останавливается и при третьем клике не работает (не прописывать же 100 кликов).

let clickCount = 0;	

$("#button5").click(Button5);

function Button5()	
{
	clickCount++;
		
	if(clickCount == 1){
		$("#box1").animate({
			  width: "10%", 
			  height: "50px", 
		}, 800, "linear"
		);

		$("#box2").animate({
			width: "50%", 
			height: "300px",	
		}, 1000, "linear"
		);

		$("#box3").css({
		"background-color": "blue",	
		});
	}
	else(clickCount == 2)
	{
    $(".box").css(
    {
	    width: "", // ширина элемента
	    height: "", // высота элемента
	    fontSize: "", // размер шрифта элемента
	    borderWidth: "", // ширина границ элемента
	    "background-color": "#FFFFFF",
    }).text("");}

}
  • Вопрос задан
  • 102 просмотра
Решения вопроса 1
MagnusDidNotBetray
@MagnusDidNotBetray
Самый елеустремленный человек
Не работает, потому что ошибок много.
Не else(clickCount == 2), а
else if(clickCount == 2)
Не "background-color", а "backgroundColor"
Счетчик нужно обнулить, как сказали выше.
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
Нужно счётчик обнулить у вас указано действия только когда счётчик == 1 и == 2 когда от > 2 ничего не делается. И счётчик должен быть не let а var
var clickCount = 0;   // не let а var

$("#button5").click(Button5);

function Button5()
{
clickCount++;

if(clickCount == 1){
$("#box1").animate({
width: "10%",
height: "50px",
}, 800, "linear"
);

$("#box2").animate({
width: "50%",
height: "300px",
}, 1000, "linear"
);

$("#box3").css({
"background-color": "blue",
});
}
else(clickCount == 2)
{
$(".box").css(
{
width: "", // ширина элемента
height: "", // высота элемента
fontSize: "", // размер шрифта элемента
borderWidth: "", // ширина границ элемента
"background-color": "#FFFFFF",
}).text("");
clickCount = 0;    // обнуляем
}

}
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы