Resimler gönderiler için kullanışlıdır. Ancak mümkün olduğunca az ve / veya küçük resimler kullanmak gerekir.
Bilgisayardaki bir hata mesajı veya kodu resim olarak eklemek yerine kendisini
kopyalayıp yapıştırın.
Resimler gönderiler için kullanışlıdır. Ancak mümkün olduğunca az ve / veya küçük resimler kullanmak gerekir.
Bilgisayardaki bir hata mesajı veya kodu resim olarak eklemek yerine kendisini
kopyalayıp yapıştırın.
0
Bir etiket görünen alana girdiğinde ilgili başka bir etiketi vurgulama
Merhaba arkadaşlar,
Sayfamda sıralı şekilde divler var ve divlerin id leri var.
Ekranı aşağı doğru kaydırırken başka bir id li dive geçtiysem navbarda o idye bağlı butonun rengininin değişmesini istiyorum.
Nasıl yapabilirim?
Soran:15.09.20 23:58
misafir
0
çıklamalarını daha sonra yazacağım.
Bu örnek div'in yarısı göründüğünde ilgili tuşu vurgular.
<html>
<head>
<meta charset="utf-8" />
<title>Test</title>
<style>
.sBaslik {
position:fixed;
left:0px;
top:0px;
height:30px;
background:white;
width:100%;
}
.sBaslik button {
background-color:#fafafa;
margin-right:3px;
}
.sBirDiv {
margin:10px 0px 10px 0px;
background:silver;
min-height:700px;
}
</style>
</head>
<body>
<div class='sBaslik'>
<button id="btn_KTest1" class="sUstButton">Button 1</button>
<button id="btn_KTest2" class="sUstButton">Button 2</button>
<button id="btn_KTest3" class="sUstButton">Button 3</button>
<button id="btn_KTest4" class="sUstButton">Button 4</button>
</div>
<div style="margin-top:30px">
<div id="dv_KTest1" class="sBirDiv"></div>
<div id="dv_KTest2" class="sBirDiv"></div>
<div id="dv_KTest3" class="sBirDiv"></div>
<div id="dv_KTest4" class="sBirDiv"></div>
</div>
<script>
function kontrol() {
var dvs = document.querySelectorAll(".sBirDiv");
for (var i=0; i<dvs.length; i++) {
var el = dvs[i];
var bcr = el.getBoundingClientRect();
if ((bcr.top <= window.innerHeight && bcr.bottom >= bcr.height / 2)) {
Array.from(document.querySelectorAll(".sUstButton")).forEach(btn=>btn.style.removeProperty("background-color"));
document.querySelector("#" + el.id.replace(/dv_K/, "btn_K")).style.backgroundColor = "#aaaaaa";
break;
}
}
}
function baslat() {
document.addEventListener("scroll", kontrol);
window.addEventListener("resize", kontrol);
window.addEventListener("load", kontrol);
window.addEventListener("orientationchange", kontrol);
kontrol();
}
document.addEventListener("DOMContentLoaded", baslat);
</script>
</body>
cevapsitesi.com'a katkınızdan dolayı teşekkür ederiz. Cevap yazarken lütfen şunlara dikkat edin:
Cevabınız açık ve net olmalıdır. Varsa alıntılar, bağlantılar, resim veya program kodu eklemelisiniz.
Eğer soru hakkında görüş bildirecekseniz veya cevap haricinde başka bir şey söylemek istiyorsanız yorum olarak yazın.
Tartışma çıkaracak cevaplardan kaçının, hitabınıza dikkat edin, "Kardeşim", "Arkadaşım" gibi ifadeler kullanmayın.
Eleştirmeyin. Sadece bilginizi gösterin ve fikrinizi söyleyin.
Büyük harf kullanmaktan ve cümle kurmaktan çekinmeyin. :)
Buraya yeni bir soru yazmayın, "benim de şöyle bir sorunum var" gibi eklemeler yapmayın. Sorunuz varsa yeni soru ekleyin.
ÜSLUP
ve SAYGI çok önemlidir. İnsanlar cevabınızdan çok üslubunuza dikkat ederler.
Cevabı, bir cevabın veya sorunun yorumu olarak dönüştürmek için ilgili cevabı veya soruyu tıklayın. [
İptal ]
