SCSS de loading animasyonu çalışmıyor.
Normal SCSS' e geçmeden önceki CSS dosyamda bu loader vardı.
.loader {
position: absolute;
z-index: 10;
z-index: 100;
left: 0;
width: 100%;
top: 0;
height: 100%;
background: #fff
}
.spinner {
position: absolute;
top: 50%;
left: 50%;
width: 50px;
height: 50px;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
.double-bounce1,
.double-bounce2 {
width: 100%;
height: 100%;
border-radius: 50%;
background-color: #ffc107;
opacity: .6;
position: absolute;
top: 0;
left: 0;
-webkit-animation: sk-bounce 2s infinite ease-in-out;
animation: sk-bounce 2s infinite ease-in-out
}
.double-bounce2 {
-webkit-animation-delay: -1s;
animation-delay: -1s
}
SCSS teknolojisine geçtiğimde bütün CSS mi SCSS formatına uyarladım. Ama loader' ın animasyonu çalışmıyor. ".double-bounce1" ve ".double-bounce2" classlarında olan animasyonlar çalışmıyor. SCSS dosyamda aynı şekilde bulunuyorlar.
Soru hatalı mı? 👎
Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!
Cevaplar (1)
Tam HTML'i görmeden fazla stabil birşey söyleyemiyorum (hangi elementler hangi elementin içinde olduğu bu koddan belli değil), ayrıca verilen kodda elementlerde kullanılan sk-bounce
keyframes animasyonunun kodları verilmemiş.
Bunların dışında kodda gördüğüm kadaryıla herhangi bir yazım hatası yok.