Sayfa Yükleniyor Kodu ve Efekti

Yazılarımız ve Makalelerimiz.

Anasayfa Multi Medya Blog Sayfa Yükleniyor Kodu ve Efekti
0 Yorum 140 Okuma

Web sayfanız için sayfa yükleniyor kodu. Web sayfanız arka planda yüklenirken ön planda ziyaretçilerinize güzel bir yükleniyor efekti gösterebilirsiniz. Sayfa yükleniyor kodları web sayfalarınıza profesyonel bir hava katar. Ayrıca geç yüklenen web sitelerinde ziyaretçilerin hemen çıkmasını engeller. Sayfa yükleniyor görselini istediğiniz şekilde seçebilirsiniz. Böylece ziyaretçileriniz için ilgi çekici bir görsel koyarak sayfayı kapatmalarının önüne geçersiniz. Bunun için öncelikle sayfanıza aşağıdaki jquery kütüphanesi kodunu ekleyin. Css kodlarını ister direkt sayfaya ekleyin isterseniz ana css dosyanızın arkasına ekleyin. .no-js #loader { display: none; } .js #loader { display: block; position: absolute; left: 100px; top: 0; } .se-pre-con { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background: url(../images/Preloader_3.gif) center no-repeat #fff; } Kodu sayfamızda göstermesi için aşağıdaki kodutagının hemen altına ekleyin.

 

Aşağıdaki js kodunuda sayfanın alt tarafınatagının üstüne ekleyebilirsiniz. Burada sayfamızdaki diğer jquery uygulamaları ile çakışmaması için değikenimizi değiştirdik. İsterseniz sizin web sitenizde çakışma yoksa değişkeni değiştirmeyebilirsiniz. Aşağıda kendi sayfamda kullandığım yükleniyor resmi var. Sağ tıklayıp farklı kaydet diyerek alabilirsiniz. Ama istersenizde css kodlarındada gerekli değişikliği yapıp kendi animasyon resminizi de kullanabilirsiniz.

Okuyucu Yorumları

0 Yorum