Profil detayı eklendi, herkes profillerine girip bir gözatsın! Sevdiğiniz üyelerin cevaplarını takip edin! Tüm güncellemeler

Divin Üstüne Gelince İconu Aşağı Kaydırma

Merhabalar İyi Geceler Hocalarım.

bir sorunum var büyük ihtimalle Javascript ile yapılacak gibi ama JS çok bilmiyorum malesef.

şimdi bir Div in içinde icon var divin üstüne gelince divin içindeki iconu 5px aşağı kaydırmak istiyorum. Hover ile yaparsam icon için hover kullanırsam iconun üstüne gelince aşağıya kayıyor ama ben divin üstüne gelince kaymasını istiyorum bunu nasıl yapabilirim ? yardım edebilirmisiniz ?

3

Cevaplar (3)

İşlem devam ediyor, lütfen bekleyin..
Olcay UZUN
@rocksijen
4 ay önce

Merhaba,


https://codepen.io/rocksijen/pen/mQGjOL


burada basit bir örnek yazdım. umarım işini görür.

Cevapla @berkacarcom4 ay önce
@rocksijen, hepinize çok teşekkürler hocalarım yardımınız için.
İşlem devam ediyor, lütfen bekleyin..
Abdulbaki Zırıh
@abdulbaki
4 ay önce [Güncellendi]

CSS ile yapılabilir.

<!-- Font Awesome'ı dahil ediyoruz -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">


<style>
	.scroll{
		background: red;
		width: 10px;
		height: 10px;
	}
    /* Scroll class'ı hover olduğunda .icon class'ını 50px aşşağıya taşır. */
  	.scroll:hover ~ .icon{
		margin-top: 50px;
	}
</style>
<!-- Üstüne geldiğinde icon class'ını tetikleyecek olan divimiz. -->
<div class="scroll">
</div>
<!-- Tetiklenecek divimiz -->
<div class="icon">
	<i class="far fa-smile"></i>
</div>

Cevapla @berkacarcom4 ay önce
@abdulbaki, hepinize çok teşekkürler hocalarım yardımınız için.
İşlem devam ediyor, lütfen bekleyin..
Serdar Güler
@gulers
4 ay önce

Sanırım istediğin böyle birşey https://codepen.io/serdarguler/pen/wQQKjY


Sen icona hover veriyor olabilirsin. Ama dış dive hover verip içeriisndeki birşeyi hareket ettirebilirsin. Javascripte ihtiyacın bunda yoktur. Ama icon bir divin içinde değilse farklı bir dive hover olup bunların dışında bir icon hareket edecekse javascript ya da @abdulbaki nin yöntemi ile çözebilirsin.

Cevapla @abdulbaki4 ay önce
@gulers, Icon div'in dışında olsa bile css ile müdahale yapılabilir. Bunun için örnekte gösterdiğim gibi ~ bu operatörü kullanabiliriz.
Cevapla @abdulbaki4 ay önce
@abdulbaki, Tabi senin söylediğin de doğru her elemente müdahale edilemiyebiliyor.
Cevapla @gulers4 ay önce
@abdulbaki, sorusunda divin içinde icon var dediği için aslında benim yaptığım örnek arkadaşa yeterli olacaktır. Divin hemen ardından geliyorsa senin yöntemde işini görecektir.
Cevapla @berkacarcom4 ay önce
@gulers, hepinize çok teşekkürler hocalarım yardımınız için.
İşlem devam ediyor, lütfen bekleyin..

Cevap yaz Sadece sorunun cevabını yazın

Yabancı Dizi Arşivi