Yeni Kayıt
Konudaki Resimler
|
Hızlı 
Bildirim
Header Bölümü Süreli Sabitleme
Sıcak Fırsatlarda Tıklananlar
Editörün Seçtiği Fırsatlar
Daha Fazla 
Bu Konudaki Kullanıcılar:
Daha Az 
3 Misafir - 3 Masaüstü
Giriş
Mesaj
-
-
javascript ile ;
<script>
"use strict";
(function () { -- ilk yüklemede 1 defaya mahsus çalışacak fonksiyon.
window.setTimeout(headerGizleFonk, 5000);
}());
function headerGizleFonk() {
const header = document.getElementById("header"); -- header değişkene atama
header.style.display="none"; --javascript ile gizleme
$(header).slideUp(); -- jquery ile gizleme
}
</script> -
Teşekkür ederim ama kod çalışmıyor yada ben eksik yapıyorum.
Header id'im "fixed-header32" giriyorum ama herhangi bi etki yapmıyor. -
jquery ile gizleme yapıyorsan jquery eklemen gerekir sayfaya.
head bölümüne :
<script src="https://code.jquery.com/jquery-3.4.1.js"></script>
bunu ekleyerek jquery eklemiş olursun.gizleme kısmını da body nin altına veya harici js dosyasına yazman gerekir. -
Kod çalışıyor çok teşekkür ederim fakat header 5 sn sonra komple gizliyor :D
Benim istediğim header üst bölümünde yani en yukarı çıkınca dursun aşağı indiğim zaman sayfayı takip ederken 5 sn sonra gizlensin -
scroll olayı kullanman gerek.sana kod yolluyorum -
chnkyn
kullanıcısına yanıt
Çok teşekkür ederim bekliyorum. -
süreden ziyade istediğini karşılayacak kodlar.
let header = document.getElementById("fixed");
let scrollTop;
$(window).scroll(function () {
scrollTop = window.scrollY;
if (scrollTop <= 100)
{
$(header).slideDown();
}
else if (scrollTop > 100)
{
$(header).slideUp();
}
}
scroll değeri 100 den küçük ise yani üste geldiyse görünür, 100 den büyük ise gizlenir. -
senin dediğin gibi olması için ;
sayfa yüklenince 5 saniye sonra gizlersin
ama ne zaman göstereceksin ?
tekrar göstermeyi yine scroll olayına bağlayabilirsin.
-5 saniye sonra gizlendi.
-gizlendikten hemen sonra veya bir kaç saniye sonra scroll olayı eklersin.scroll olayında scroll değerini kontrol edersin.tıpkı örnekteki gibi.100 den az ise yukarda demektir ve headerı gösterirsin.
- buradaki sorun kullanıcı bu süre zarfında belki de hiç aşağıya gelmemiştir.durduğu yerde önce gizleyip sonra göstermiş olursun. -
chnkyn
kullanıcısına yanıt
Evet demek istediğini anladım fakat scroll'a duyarlı olarak değiştirdim kodları süreli olanı sildim, herhangi bir gizleme olayı olmadı. -
olabilecek nedenler
- jquery eklememiş olabilirsin
- harici dosyasına yazmış olabilir ve bu harici dosyayı head bölümünde çağırıyor olabilirsin
1'in cevabı jquery eklemek
2'nin cevabı ;
<script src"***" defer="defer"></script> çağırdığın yere defer="defer" veya sadece defer eklemek.bu sayfa yüklendikten sonra dosyayı çağırır.
2. çözüm olarak jquery eklediysen;
js dosyanın içindeki tüm kodları döküman yüklendikten sonra çağır.
$(function(){
"use strict";
javascript dosyandaki tüm kodları bu fonksiyon içine al.
} -
chnkyn
kullanıcısına yanıt
Kodu aşağıdaki şekilde ekledim ama çalışmıyor. Kütüphanenin en son sürümü websiteme çağırılık zaten.
<script>
$(function(){
"use strict";
let header = document.getElementById("fixed-header32");
let scrollTop;
$(window).scroll(function () {
scrollTop = window.scrollY;
if (scrollTop <= 100)
{
$(header).slideDown();
}
else if (scrollTop > 100)
{
$(header).slideUp();
}
}
}
</script> -
bir labela scroll olayındaki scrolltop değerini yazdırır mısın? değişiyor mu?
ayrıca kodda < işareti yerine < çıkıyor.bu kodunda da böyle mi yoksa burada mı böyle görünüyor. -
chnkyn
kullanıcısına yanıt
zamanını çalıyorum çok yardımcı oluyorsun teşekkür ederim.
<script>
$(window).scroll(function() {
if ($(this).scrollTop() > 0) {
$('.fixed-header32').fadeOut();
} else {
$('.fixed-header32').fadeIn();
}
});
</script>
Bu kodla hallettim. Bir sorum var bu koda ekstradan mouse üzerine gelincede göstersin diye bir komut ekleyebilir miyim? -
headerı gizliyorsun.mouse ile gösterebilmek için headerı değil içindekileri gizle.header background transparent yaparsın.sonra header'a
const icindekiler=...; -- içindekileri seçersin
$(header).hover(function(){ --hover fonksiyonu
$(icindekiler).slideDown();
},function(){ -- over fonksiyonu."," ile ayrılır.
$(icindekiler).slideUp()
})
ayrıca kodların tam bağımsızlığı için kodlara özen gösterin.
css ve javascript selectorlerini ayırın.
fixed-header32 classını sadece css selectorlerinde kullanın.
javascript için de js-fixed-header32 classı gibi bir class ekleyin.javascript ile işlemlerde bu classa erişin.
başka bir tavsiye oocss ve bem mimarilerini gözeterek yazın :)
< Bu mesaj bu kişi tarafından değiştirildi chnkyn -- 22 Temmuz 2019; 3:30:57 > -
çok teşekkür ederim. Hakkını helal et.
Bir tane daha en önemli konuyu açtım.
https://forum.donanimhaber.com/ios-ve-macos-ta-tam-ekran-sorunu-yardimci-olur-musunuz--139213942
ne yapsam halledemedim. Bilgin varsa o konuyada el atar mısın?
Sayfa:
1
Ip işlemleri
Bu mesaj IP'si ile atılan mesajları ara Bu kullanıcının son IP'si ile atılan mesajları ara Bu mesaj IP'si ile kullanıcı ara Bu kullanıcının son IP'si ile kullanıcı ara
KAPAT X
Bu mesaj IP'si ile atılan mesajları ara Bu kullanıcının son IP'si ile atılan mesajları ara Bu mesaj IP'si ile kullanıcı ara Bu kullanıcının son IP'si ile kullanıcı ara
KAPAT X
