Linke Gelince Değişen Resim (Javascript Rollover)

yasarkemaldag · #1 (**permalink**) 28-08-2007, 00:59:11

Baktım forumda istekler artıyor bu makaleyi yazayım dedim

Şimdi yardım konusuna yazmadın niye yeni konu açıyorsun diye düşünenlere söyleyim.Amacım Seo

Googledan arayanlarda yararlanması için.

şimdi a.jpg ve b.jpg adında 2 tane resimimiz var.

sayfamızda birde link var diyelim.mouse bu link üzerine gelince resim değişsin çekince eski haline gelsin diyelim.

javascript kullanacağım bunun için.

Hazırsanız Başlayalım:

önce

Code:

<img src="a.jpg" name="resim" id="resim">

adı ve id değeri resim olan bir resim oluşturdum.

sonra javascript fonksiyonlarımızı yazacaz.

Code:

<script language="javascript">
function ykd_resim_over() {
document.resim.src="b.jpg";
}
function ykd_resim_out() {
document.resim.src="a.jpg";
}
  </script>

yukarıdaki kodda resim_over fonksiyonunda resim isimli nesnenin src değerini b.jpg resim_out ta ise a.jpg olarak ayarladım.

şimdi sayfamıza bir link ekleyelim.

Code:

<a href="#" onMouseOver="ykd_resim_over();" onMouseOut="ykd_resim_out();">Resim Değiştirme Linki (Mause yi üzerine getirip çekin)</a>

burada ise onMouseOver yani mousenin linkin üzerine geldiği anda ykd_resim_over fonksiyonunu onMouseOut yani mouse linki terkettiği anda ise ykd_resim_out fonksiyonunu çalıştırmasını söyledim.

Şimdi sayfamızı kaydedelim ve deneyelim.

örnek olarak alttaki kodları kopyalayıp not defterine yapıştırın ve sayfayı a.html olarak kaydedin.a.html dosyasının olduğu yere a.jpg ve b.jpg adında 2 tanede resim dosyası ekleyin ve deneyin.

Code:

<html>
<body>
<p><img src="a.jpg" name="resim" id="resim">
</p>
<p>&nbsp;</p>
<p><a href="#" onMouseOver="ykd_resim_over();" onMouseOut="ykd_resim_out();">Resim Değiştirme Linki (Mause yi üzerine getirip çekin)</a>
  <script language="javascript">
function ykd_resim_over() {
document.resim.src="b.jpg";
}
function ykd_resim_out() {
document.resim.src="a.jpg";
}
  </script>
</p>
</body>
</html>

Makale Tamamen Bana Aittir.Değiştirip Başka Forumlarda Kendi Yapmış Gibi Paylaşanlara Hakkım Helal Değildir.

YKD-SoFTWaRe İnternet Hizmetleri
Yetkili: Yaşar Kemal DAĞ
Ana Sayfa <----> YKD-SoFTWaRe İnternet Hizmetleri

SanCreaL · #2 (**permalink**) 29-08-2007, 16:41:16

Hocam Eline sğalık Tam radığıklarım diyebilirim =)

Okuduğunuz Konuya Benzer Konular
Konu	Konuyu Açan	Forum	Cevaplar	Son Mesaj
Sayfa Yenilendiğinde Değişen Resim	UNREALCI	PHP	7	10-06-2008 22:20:31
Sürekli resim değişen banner	Bybadman	Flash & Action script	7	29-09-2007 14:57:54
Değişen Resim Sistemi	kerim2155	PHP	5	29-08-2007 17:48:52
Resmin üzerine gelince başka bir resim	vys	ASP	3	11-11-2006 23:24:26

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

Konu Seçenekleri
Yazdırılabilir Sümü Göster Sayfayı E-Mail'le gönder