[soul]

Nedir ?
SoulTip JS & DHTML teknolojileri kullanılarak yazılmış bir küçük bir skripttir. Sayfanızda objelerin üzerine gelince bir açıklama veya herhangi başka bir şey çıkarmanıza izin verecektir.


Uyumluluk
IE5+ üzerinde test edilmiştir.
Resim, form Objesi, Linklerde sağlıklı bir şekilde çalışmaktadır.


Download
http://ferruh.mavituna.com/opensource/fmhelpv7.zip


Detaylı Açıklama ve Örnekler
http://ferruh.mavituna.com/article.asp?181


Kullanım
.zip dosyasından çıkacak "CSS" klasörünü ve "js" klasörünü sitenizin altına kopyalayın.
Sayfanıza

PHP Code:

<!--SoulTip için Gerekli Kodlar-->
<script language="JavaScript" src="js/soultip.js" type="text/JavaScript"></script>
<link href="CSS/soultip.CSS" rel="stylesheet" type="text/CSS" />

<!--Bu tablo herhangi bir HTML Editörde basitçe özelleştirilebilir, Önemli olan <div id="soultip"></div> içerisinde kalmasıdır-->
<div id="soultip">
  <table border="0" cellpadding="0" cellspacing="0" width="195">
    <tr> 
      <td><img src="soultipmg/spacer.gif" width="8" height="1" border="0" alt="" /></td>
      <td><img src="soultipmg/spacer.gif" width="186" height="1" border="0" alt="" /></td>
      <td><img src="soultipmg/spacer.gif" width="1" height="1" border="0" alt="" /></td>
      <td><img src="soultipmg/spacer.gif" width="1" height="1" border="0" alt="" /></td>
    </tr>
    <tr> 
      <td colspan="3"><img src="soultipmg/gup_r1_c1.gif" alt="" width="195" height="1" border="0" /></td>
      <td><img src="soultipmg/spacer.gif" width="1" height="1" border="0" alt="" /></td>
    </tr>
    <tr> 
      <td rowspan="2"><img src="soultipmg/gup_r2_c1.gif" alt="" width="8" height="58" border="0" /></td>
      <td valign="top" bgcolor="#FFFF00" align="center" valign="middle" id="soultipinner">&nbsp;</td>
      <td rowspan="2"><img src="soultipmg/gup_r2_c3.gif" alt="" width="1" height="58" border="0" id="gup_r2_c3" /></td>
      <td><img src="soultipmg/spacer.gif" width="1" height="56" border="0" alt="" /></td>
    </tr>
    <tr> 
      <td><img src="soultipmg/gup_r3_c2.gif" alt="" width="186" height="2" border="0" /></td>
      <td><img src="soultipmg/spacer.gif" width="1" height="2" border="0" alt="" /></td>
    </tr>
  </table>
</div>
<!--/SoulTip için Gerekli olanlar--> 


Kodlarını ekleyin.

Bundan sonra

PHP Code:

<a href="http://forum.zoque.net" help="Zoque Forumda Scriptin detaylı açıklamasını yaptık">Zoque forum</a> 


şeklinde sayfanızda kullanabilirsiniz. Yani ilgili objenin tagının içerisine help="tooltip metni" yazmanız yeterlidir.

Önemli olan noktalar
Javascriptin ve CSS' nin herhangi bir şekilde sayfaya eklenmiş olması.
<div id="soultip">... ile başlayan "soultip" divinin sayfada bulunması.

Bunun yerine
<div id="soultip"><div id="soultipinner"></div></div>
yazmanızda scriptin temel olarak çalışması için yeterlidir.

Özelleştirmeleri CSS dosyasından yapabilirsiniz. Aynı şekilde divin içerisini de kendinize göre özelleştirebilirsiniz.

Unutmayın ki "<div id="soultipinner"></div>" içerisindee tooltip metin gözülecek. Bu <td id="soultipinner"></td> veya <span id="soultipinner"></span>

şeklinde de olabilir.



Ekran Görüntüsü
http://ferruh.mavituna.com/opensourc...screenshot.gif


Yardım Destek
Buradan veya http://ferruh.mavituna.com dan destek & Yardım alabilirsiniz.