[COLOR="SeaGreen[SIZE="4 [URL="https://tik.lat/WGJ48"] Tıkla [/URL]
Butonun üzerine kırmızı veya siz ne renk kullanmak isterseniz o renk bir nokta ekliyoruz.
Yapmış olduğumuz noktayı hareket ettirmek için ilk önce bu kodu yazıyoruz
Fare ile noktanın üzerine gelip sola hareket ettirseniz noktanın fareyi takip ettiğini göreceksiniz.
Noktanın hareket ettiği zaman büyümesini sağlamak istiyorsak bunu ekliyoruz.
Biz çemberin üzerine geldiğimiz zaman artık noktanın sola kendisin gitmesini istiyoruz bunu yapabilmek için bu satırı ekliyoruz.
Bu işlemleri yaptıktan sonra noktanın artık sola gittiği zaman çemberden kenara çıkmasını engelliyecez.
[COLOR="red [URL="https://tik.lat/2sqD4"] Tıkla[/URL]
[COLOR="red [URL="https://tik.lat/uDb8h"] Tıkla[/URL][/SIZE][/COLOR][/RIGHT]
Butonun üzerine kırmızı veya siz ne renk kullanmak isterseniz o renk bir nokta ekliyoruz.
Kod:
a:before
{
content: '';
position: absolute;
left: 60px;
top: 50%;
transform: translateY(-50%) scale(.6);
width: 10px;
height: 10px;
background: #ff0052;
border-radius: 50%;
z-index: -1;
transition-property: left, transform;
transition-delay: 0s,0s;
transition-duration: 1s,0.5s;
}Yapmış olduğumuz noktayı hareket ettirmek için ilk önce bu kodu yazıyoruz
Kod:
a:hover:before
{
left: 10px;
}Fare ile noktanın üzerine gelip sola hareket ettirseniz noktanın fareyi takip ettiğini göreceksiniz.
Noktanın hareket ettiği zaman büyümesini sağlamak istiyorsak bunu ekliyoruz.
Kod:
transform: translateY(-50%) scale(20);Biz çemberin üzerine geldiğimiz zaman artık noktanın sola kendisin gitmesini istiyoruz bunu yapabilmek için bu satırı ekliyoruz.
Kod:
transition-delay: 0s, 1s;Bu işlemleri yaptıktan sonra noktanın artık sola gittiği zaman çemberden kenara çıkmasını engelliyecez.
[COLOR="red [URL="https://tik.lat/2sqD4"] Tıkla[/URL]
[COLOR="red [URL="https://tik.lat/uDb8h"] Tıkla[/URL][/SIZE][/COLOR][/RIGHT]
[SIZE="3
Son düzenleme:
