Temamıza Yükleniyor Efekti - Webmaster Forumu

Outface · #1 (**permalink**) 11-06-2007, 17:21:46

İster Xoops sitelerinden indirdiğiniz favori temanızı kullanın isterseniz bizim derslerimizden faydalanarak veya kendi çabanızla bir tema yapmış olun. Hazır CMS'leri kullanmanın en kötü yanı bütün sitelerin hemen hemen aynı olması, bu durumda sitenizi diğerlerinden ayıracak şeyler yapmalısınız.

Zaman zaman temanızı özelleştirmeniz için bir takım ipuçlarını dersler bölümünden sizlerle paylaşacağım..bu dersteki konumuz sayfalarımıza yükleniyor pencerisi açtırmak ve yükleme bittiğinde pencereyi kapatmak..

Bildiğiniz gibi bir html dökümanı head ve body olmak üzere 2 bölümden oluşuyor..head bölümü öntanımlamaları içerirken body bölümü sayfalarımızın içeriğini taşıyor..eğer sitenizde yüklenmesi ağır içerikler sunuyorsanız ve sayfalarınızın yüklenme süreleri çok uzun sürüyorsa aşağıdaki işlemleri yaparak hiç değilse kullanıcılarınızın sıkıntısını bir nebze önleyebilirsiniz

şimdi theme.html dosyanızı bir metin editöründe açın..body bölümünün en başına yani taginden hemen sonra aşağıdaki kodları ekleyin..

Kod:

<div id='waitDiv' style='position:absolute;left:2%;top:20%;visibility:hidden;text-align: center;'>
  <table cellpadding='6' style='border:2px solid #336699' bgcolor='#FFFFFF'>
    <tr>
      <td style='text-align:center' bgcolor='#FFFFFF'>
        <b>
          <big>Yükleniyor...</big>
        </b><br>
<img src='<{$xoops_url}>/images/yukleniyor.gif'><br>
Lütfen bekleyin... 
      </td>
    </tr>
  </table>
</div>
<script type='text/javascript'> <!--

Kod:

  var DHTML = (document.getElementById || document.all || document.layers);
function ap_getObj(name) { if (document.getElementById) { return document.getElementById(name).style; } else if (document.all) { return document.all[name].style;
} else if (document.layers) { return document.layers[name]; } } function ap_showWaitMessage(div,flag)  { if (!DHTML) return; var x = ap_getObj(div); x.visibility = (flag) ? 'visible':'hidden'
if(! document.getElementById) if(document.layers) x.left=280/2; return true; } ap_showWaitMessage

gördüğünüz gibi kodun işleyişi çok basit..resim ve mesaj içeren alanları kendinize göre özelleştirebilirsiniz..

şimdi sayfanın yüklenmesi bittiğinde pencereyi kapatacak kodu taginden hemen önce bir yere girin..işte kod;

Kod:

<script type='text/javascript'> 
<!--
 ap_showWaitMessage('waitDiv', 0);
//-->
</script>

Alıntıdır..

Bora Canbula - xoopshocasi@xoopshocasi.com

Seçenekler
Yazdırılabilir şekli göster Sayfayı E-Mail olarak gönder
Stil
Normal Hybrid-Şeklinde gösterime geç Ağaç şeklinde gösterime geç

Benzer Konular
Konu	Konuyu Başlatan	Forum	Cevaplar	Son Mesaj
Yazı Efekti (Havai Fişek)	Alone	Photoshop, Corel, Freehand, Fireworks	2	12-11-2007 17:52:12
Durum Çubuğunda Yükleniyor	Alone	HTML CSS DHTML	7	26-07-2007 16:19:01
Yükleniyor Modu	Metallica	SMF	0	12-05-2007 16:24:03
Yaşlandırma Efekti	MetTo	Photoshop, Corel, Freehand, Fireworks	14	10-02-2007 18:57:58
Flash ile kar yağdırma efekti yapalım	STI	Flash, Director, Swift ve 3D	0	08-02-2007 01:15:43

Konuyu Toplam 1 Üye okuyor. (0 Kayıtlı üye ve 1 Misafir)