Как вытащить анимацию в js из css!
Вот, поправил. Но все равно не работает, не выводится gif при отправке данных
$.ajax({
url: "assets/ajax/mail.php",
type: "POST",
dataType : "json",
cache: false,
contentType: false,
processData: false,
data: formData, //указываем что отправляем
beforeSend: function () {
$("#sendMail").prop("disable", true);
$("_sending").show();
},
success: function(data){
$("#form_contact").trigger("reset");
console.log(data);
}
});.comment-form {
position: relative;
}
.comment-form::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(51, 51, 51, 0.9) url(loading.gif) center / 50px no-repeat;
opacity: 0;
visibility: hidden;
transition: all 0.5s ease 0s;
}
.comment-form._sending::after {
opacity: 1;
visibility: visible;
}Нужно реализовать анимацию при отправке ajax отправки. В css прописал gif файл и скрыл. Пытаюсь открыть при отправке ajax запроса. Но не выходит! Как обратится к гивке из css что бы js включил ее.
Спасибо!
//отправляем через ajax
$.ajax({
url: "assets/ajax/mail.php",
type: "POST",
dataType : "json",
cache: false,
contentType: false,
processData: false,
data: formData, //указываем что отправляем
beforeSend: function () {
$("#sendMail").prop("disable", true);
$("#_sending").hide();
},
success: function(data){
$("#form_contact").trigger("reset");
console.log(data);
}
});
return false;
});.comment-form {
position: relative;
}
.comment-form::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(51, 51, 51, 0.9) url(loading.gif) center / 50px no-repeat;
opacity: 0;
visibility: hidden;
transition: all 0.5s ease 0s;
}
.comment-form._sending::after {
opacity: 1;
visibility: visible;
}Ответы (1 шт):
Автор решения: Sirius_MkLain
→ Ссылка
Короче, эта тема не работает с псевдоклассами. Ток с классами.