| 1.Adım
Bu javaScript kodlamasını Script le başlayan kodlama <HEAD>
</HEAD>
tag'lerinin arasına gelecek şekilde yazılmalıdır.
2.Adım:
Aşağıda verilen JavaScrip mausla resimlerin üzerine gidildiğinde resimlere
hareket vermemizi sağlar. Bunun için kaçtane resimin hareketli olmasını
istiyorsak ona göre kodlamada bazı değişiklikler yaparak bunu sağlamamız
gerekir.Önce grafik editörü ile;
image1-1.GIF, image1-2.GIF,
image2-1.GIF,
image 2-2.GIF
adlarında 4 adet grafik dosyasını(resimleri) hazırlayalım.
"-1"
uzantısı ile biten dosyalar resmin ilk halini
"-2"
uzantısı ile bitenler ise resmin fare imleci üzerine gittiği halini
oluşturacaktır.Buna dikkat edin.!
3.Adım:
Script'imizde her bir resim için bilgi
"aOn.src", "bOn.src"
gibi değişkenlerde tanımlanmış. Bu değişkenleri uzatarak dilediğiniz
sayıda kısayol kullanabilirsiniz. Resimleri oluşturduktan sonra örnek HTML
dosyamızı oluşturun ve resimleri HTML sayfanızla aynı klasöre taşıyın.
Resim ebatlarını değiştirmek için ise tek yapacağınız
newImage(100, 20);
ifadesi ile oynamak olacaktır.Veya 4 adımda anlatılan kodlarda img
link
paremetrelerinden WIDTH="" ve HEIGHT=""
taglerinin tırnakları arasına
istenilen ebatlar yazılarakta bu sağlanabilir.
4.Adım:
Aşağıdaki JavaScript kodlarını 1 adımda anlatılan yere kes ve yapıştır
yön
temiyle kopyalayın.
<script language="javaScript">
if ((navigator.appName == "Netscape" && parseInt
(navigator.appVersion)>= 3)
|| (navigator.appName == "Microsoft Internet
Explorer" && parseInt(navigator.appVersion)
>= 4)) {
rollOvers = 1;} else {rollOvers = 0;}
var dirLevel = 1;
var levelMod = "";
levelMod = "";
for (i = 0;i < dirLevel;i++) {}
if (rollOvers) {
aOn = new Image(100, 20);
aOn.src = "image1-1.gif";
aOff = new Image(100, 20);
aOff.src = "image1-2.gif";
bOn = new Image(100, 20);
bOn.src = "image2-1.gif";
bOff = new Image(100, 20);
bOff.src = "image2-2.gif";
}
function switchOn(imgName) {
if (rollOvers){
imgOn = eval(imgName + "On.src");
document [imgName].src = imgOn;}}
function switchOff(imgName) {
if (rollOvers){
imgOff = eval(imgName + "Off.src");
document [imgName].src = imgOff;
}}</script>
4Adım:Aşağıdaki kodları <body> </body>tagı'nın
arasına yazılacak ve ilk görünmesi istenilen resim
SRC="" de tırnakların arasına adı ve uzantısıyla bir
likte yazılacaktır.
<p><a href="http://www.geocities.com/paris/cathedral/1069"
onMouseover="switchOn('a')"
onMouseout="switchOff('a')">
<IMG SRC="image1-2.gif" border=0 name="a" WIDTH="40"
HEIGHT="40"></a>
</p><p>
<hr WIDTH="80" SIZE="1"ALIGN="LEFT" COLOR="#FF3300">
<a href="http://www.webokulu.bizland.com"
onMouseover="switchOn('b')"
onMouseout="switchOff('b')">
<IMG SRC="image2-2.gif" border=0 name="b"WIDTH="40"
HEIGHT="40"></a></p>
|
.gif){kind=small}
