..:: Master Profile : Downloads : Cheats : Tabs : HTML Goodies : Message Boards ::..
MEMBuka
TETINGKAP baru mengikut saiz
Teks
Tetap Di Window Status Bar
Skrip
ini digunakan untuk membuka satu tetingkap lain mengikut pilihan saiz yang
kita kehendaki selepas klik pada sesuatu HyperLink . Skrip ini amat
praktikal untuk membuka sesuatu laman baru yang mempunyai URL yang
berlainan .
Masukkan tag ini dalam <head>
<html>
<head>
<script language="javascript" type="text/javascript">
var win = null;
function NewWindow(mypage,myname,w,h,scroll){
LeftPosition = (screen.width) ? (screen.width-w)/2 : 0;
TopPosition = (screen.height) ? (screen.height-h)/2 : 0;
settings = 'height='+h+',width='+w+',top='+TopPosition+',left='+LeftPosition+',scrollbars='+scroll+',resizable'
win = window.open(mypage,myname,settings)
if(win.window.focus){win.window.focus();}
}
</script>
</head>
Kemudian masukkan tag ini dalam <body>
<body>
<a href="url.html" onclick="NewWindow(this.href,'name','400','400','yes');return
false">Jaringan</a>
</body>
</html>
Bahagian skrip yang perlu diubah untuk menetapkan saiz window ialah:
onclick="NewWindow(this.href,'name','400','400','yes')
..:: Butang "back" dan "forward" ::..
Skrip
ini digunakan dalam web site yang mempunyai banyak mukasurat . Ia
memudahkan anda balik ke halaman yang telah dilihat atau pergi ke
mukasurat seterusnya dengan lebih tepat dan cepat . Sebelum itu anda
haruslah membuat satu button 'back' dan 'forward' dahulu .
Skrip
ini adalah untuk butang BACK , tukar 'Back.gif' kepada nama button yang
anda telah buat :
<a href="javascript:history.back()"
><Img Src="Back.gif" Border="0"
Alt="Back"></a>
Skrip ini adalah untuk butang FORWARD , tukar 'forward.gif' kepada nama
button yang anda telah buat :
<a href="javascript:history.forward()"
><img src="Forward.gif" Border="0"
alt="Forward"></a>
Skrip ini digunakan untuk membuat ekor mengunakan imej yang anda reka pada cursor . Ia akan mengeluarkan imej yang anda buat itu di bawah cursor dan akan sentiasa mengikut cursor .
Letakkan
tag ini di dalam <body> . Sila tukar image.gif kepada nama imej yang
anda buat . Tetapkan saiz imej yang anda inginkan (height & width) .
<div id="dot0" style="position: absolute; visibility: hidden; height: 11; width: 11;"><img src="image.gif" height=11 width=11></div>
<div id="dot1" style="position: absolute; height: 11; width: 11;"><img src="image.gif" height=11 width=11></div>
<div id="dot2" style="position: absolute; height: 11; width: 11;"><img src="image.gif" height=11 width=11></div>
<div id="dot3" style="position: absolute; height: 11; width: 11;"><img src="image.gif" height=11 width=11></div>
<div id="dot4" style="position: absolute; height: 11; width: 11;"><img src="image.gif" height=11 width=11></div>
<div id="dot5" style="position: absolute; height: 11; width: 11;"><img src="image.gif" height=11 width=11></div>
<div id="dot6" style="position: absolute; height: 11; width: 11;"><img src="image.gif" height=11 width=11></div>
<script LANGUAGE="JavaScript">
var nDots = 7;
if (document.all&&window.print)
document.body.style.cssText="overflow-x:hidden;overflow-y:scroll"
var Xpos = 0;
var Ypos = 0;
var DELTAT = .01;
var SEGLEN = 10;
var SPRINGK = 10;
var MASS = 1;
var GRAVITY = 50;
var RESISTANCE = 10;
var STOPVEL = 0.1;
var STOPACC = 0.1;
var DOTSIZE = 11;
var BOUNCE = 0.75;
var isNetscape = navigator.appName=="Netscape";
var followmouse = true;
var dots = new Array();
init();
function init()
{
var i = 0;
for (i = 0; i < nDots; i++) {
dots[i] = new dot(i);
}
if (!isNetscape) {
}
for (i = 0; i < nDots; i++) {
dots[i].obj.left = dots[i].X;
dots[i].obj.top = dots[i].Y;
}
if (isNetscape) {
startanimate();
} else {
setTimeout("startanimate()", 2000);
}
}
function dot(i)
{
this.X = Xpos;
this.Y = Ypos;
this.dx = 0;
this.dy = 0;
if (isNetscape) {
this.obj = eval("document.dot" + i);
} else {
this.obj = eval("dot" + i + ".style");
}
}
function startanimate() {
setInterval("animate()", 20);
}
function setInitPositions(dots)
{
var startloc = document.all.tags("LI");
var i = 0;
for (i = 0; i < startloc.length && i < (nDots - 1); i++) {
dots[i+1].X = startloc[i].offsetLeft
startloc[i].offsetParent.offsetLeft - DOTSIZE;
dots[i+1].Y = startloc[i].offsetTop +
startloc[i].offsetParent.offsetTop + 2*DOTSIZE;
}
dots[0].X = dots[1].X;
dots[0].Y = dots[1].Y - SEGLEN;
}
function MoveHandler(e)
{
Xpos = e.pageX;
Ypos = e.pageY;
return true;
}
function MoveHandlerIE() {
Xpos = window.event.x + document.body.scrollLeft;
Ypos = window.event.y + document.body.scrollTop;
}
if (isNetscape) {
document.captureEvents(Event.MOUSEMOVE);
document.onMouseMove = MoveHandler;
} else {
document.onmousemove = MoveHandlerIE;
}
function vec(X, Y)
{
this.X = X;
this.Y = Y;
}
function springForce(i, j, spring)
{
var dx = (dots[i].X - dots[j].X);
var dy = (dots[i].Y - dots[j].Y);
var len = Math.sqrt(dx*dx + dy*dy);
if (len > SEGLEN) {
var springF = SPRINGK * (len - SEGLEN);
spring.X += (dx / len) * springF;
spring.Y += (dy / len) * springF;
}
}
function animate() {
var start = 0;
if (followmouse) {
dots[0].X = Xpos;
dots[0].Y = Ypos;
start = 1;
}
for (i = start ; i < nDots; i++ ) {
var spring = new vec(0, 0);
if (i > 0) {
springForce(i-1, i, spring);
}
if (i < (nDots - 1)) {
springForce(i+1, i, spring);
}
var resist = new vec(-dots[i].dx * RESISTANCE,
-dots[i].dy * RESISTANCE);
var accel = new vec((spring.X + resist.X)/ MASS,
(spring.Y + resist.Y)/ MASS + GRAVITY);
dots[i].dx += (DELTAT * accel.X);
dots[i].dy += (DELTAT * accel.Y);
if (Math.abs(dots[i].dx) < STOPVEL &&
Math.abs(dots[i].dy) < STOPVEL &&
Math.abs(accel.X) < STOPACC &&
Math.abs(accel.Y) < STOPACC) {
dots[i].dx = 0;
dots[i].dy = 0;
}
dots[i].X += dots[i].dx;
dots[i].Y += dots[i].dy;
var height, width;
if (isNetscape) {
height = window.innerHeight + document.scrollTop;
width = window.innerWidth + document.scrollLeft;
} else {
height = document.body.clientHeight + document.body.scrollTop;
width = document.body.clientWidth + document.body.scrollLeft;
}
if (dots[i].Y >= height - DOTSIZE - 1) {
if (dots[i].dy > 0) {
dots[i].dy = BOUNCE * -dots[i].dy;
}
dots[i].Y = height - DOTSIZE - 1;
}
if (dots[i].X >= width - DOTSIZE) {
if (dots[i].dx > 0) {
dots[i].dx = BOUNCE * -dots[i].dx;
}
dots[i].X = width - DOTSIZE - 1;
}
if (dots[i].X < 0) {
if (dots[i].dx < 0) {
dots[i].dx = BOUNCE * -dots[i].dx;
}
dots[i].X = 0;
}
dots[i].obj.left = dots[i].X;
dots[i].obj.top = dots[i].Y;
}
}
</script>
Skrip ini digunakan untuk membuang garisan bawah pada HyperLink . Anda juga boleh menggunakannya untuk menukar warna pada HyperLink tersebut . Selain itu ia juga boleh membuat perubahan warna apabila cursor berada di atas HyperLink itu ( mouse over ) dengan mengubah suai parameter ini .
Letakkan tag ini pada <head>
<style>
<!--
A:link {text-decoration:none; color:red}
A:visited {text-decoration:none; color:red}
A:hover {text-decoration:underline; color:white}
-->
</style>
Di
sini terdapat dua tag yang anda boleh pilih samada tag untuk mengeluarkan
bunyi midi iaitu background music atau bunyi pada button apabila diklik .
Untuk bunyi background , hanya fail midi yang boleh digunakan dan bagi
bunyi button , hanya fail wave bleh digunakan .
Bunyi
Latarbelakang
tukar music.mid kepada nama fail midi anda .
<NOEMBED>
<BGSOUND SRC="music.mid" LOOP="INFINITE">
</NOEMBED>
<EMBED SRC="music.mid" AUTOSTART="TRUE"
HIDDEN="TRUE" LOOP="TRUE">
Butang wav
tukar
sound.wav kepada nama fail wave anda .
<A HREF="sound.wav">Klik untuk
dengar wav</A>
Apa yang perlu anda lakukan ialah tukar nama fail (music.midi, sound.wav)
kepada nama fail yang anda pilih.
Anda hanya perlu menyalin semua skrip ini di dalam html web site anda dan lihatlah hasilnya . Tapi jangan lupa untuk menukar " Taip teks anda di sini " kepada teks yang anda ingini .
<style>
.spanstyle {
position:absolute;
visibility:visible;
top:-50px;
font-size:10pt;
font-family:Verdana;
font-weight:bold;
color:orange;
}
</style>
</head>
<!-- Skrip bahagian ini diletakkan dalam BODY TAG yang pertama. -->
<body onLoad="makesnake()" style="width:100%;overflow-x:hidden;overflow-y:scroll">
<!-- Bahagian 1 daripada 2 bahagian skrip dalam BODY TAG -->
<script>
var x,y
var step=20
var flag=0
// Teks anda disini. PERHATIAN: letakkan ruang kosong pada hujung teks anda!
var message="Taip teks anda disini "
message=message.split("")
var xpos=new Array()
for (i=0;i<=message.length-1;i++) {
xpos[i]=-50
}
var ypos=new Array()
for (i=0;i<=message.length-1;i++) {
ypos[i]=-50
}
function handlerMM(e){
x = (document.layers) ? e.pageX : document.body.scrollLeft+event.clientX
y = (document.layers) ? e.pageY : document.body.scrollTop+event.clientY
flag=1
}
function makesnake() {
if (flag==1 && document.all) {
for (i=message.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1]
}
xpos[0]=x+step
ypos[0]=y
for (i=0; i<message.length-1; i++) {
var thisspan = eval("span"+(i)+".style")
thisspan.posLeft=xpos[i]
thisspan.posTop=ypos[i]
}
}
else if (flag==1 && document.layers) {
for (i=message.length-1; i>=1; i--) {
xpos[i]=xpos[i-1]+step
ypos[i]=ypos[i-1]
}
xpos[0]=x+step
ypos[0]=y
for (i=0; i<message.length-1; i++) {
var thisspan = eval("document.span"+i)
thisspan.left=xpos[i]
thisspan.top=ypos[i]
}
}
var timer=setTimeout("makesnake()",30)
}
</script>
<!-- Bahagian 2 daripada 2 bahagian skrip dalam BODY TAG -->
<script>
for (i=0;i<=message.length-1;i++) {
document.write("<span id='span"+i+"' class='spanstyle'>")
document.write(message[i])
document.write("</span>")
}
if (document.layers){
document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = handlerMM;
</script>
[contoh]
Imej
ikon tersebut hendaklah disimpan dengan format .ico dan bersize 16 x 16
piksel. Tetapi tidak semua alat grafik dapat menyimpan imej dengan format
tersebut. Antara alat grafik yang dapat melakukannya ialah Microangelo.
Setelah selesai dengan imej ikon yang dikehendaki, masukkan skrip berikut
pada laman web.
<head>
<LINK REL="SHORTCUT ICON" HREF="http://www.URL_anda.com/nama_fail.ico">
</head>
Untuk efek yang dikehendaki dapat dilihat, laman web anda perlu di simpan
pada "favourite" di browser anda terlebih dahulu.
Kemudian tutup browser anda, dan kemudian buka semula browser anda dan
lihat pada Menu "favourite". Sekarang ikon tersebut akan
kelihatan.
[ hanya untuk internet explorer 5.0 ]
Skrip ini pula untuk membuat tarikh pada website anda . Tarikh ini akan mengikut tarikh pada taskbar . Jadi jika arikh pada taskbar salah , maka salahlah tarikh itu .
Letakkan tag ini pada <head>
<script language="JavaScript">
<!---
month = new Array(12);
month[0]="January"
month[1]="February"
month[2]="March"
month[3]="April"
month[4]="May"
month[5]="June"
month[6]="July"
month[7]="August"
month[8]="September"
month[9]="October"
month[10]="November"
month[11]="December"
day = new Array(7);
day[0]="Sunday"
day[1]="Monday"
day[2]="Tuesday"
day[3]="Wednesday"
day[4]="Thursday"
day[5]="Friday"
day[6]="Saturday"
today=new Date();
d0=today.getDay();
m0=today.getMonth();
d1=today.getDate();
y0=(today.getFullYear());
// --->
</script>
letakkan tag ini pada <body>
<script language="JavaScript">
<!---
document.write(day[d0],", ",month[m0]," ",d1,",
",y0); // --->
</script>
Skrip ini adalah untuk membuat teks yang mampunyai bebayang atau drop shadow .
<HTML>
<HEAD>
</HEAD>
<BODY bgcolor=white>
<div style="position: absolute;
top: 202px;
width: 370px;
height: 80px;
font-size: 30pt;
font-family:Verdana;
color:black; left: 60px">SIFOO</div>
<div style="position: absolute;
top: 200px;
width: 370px;
height: 80px;
font-size: 30pt;
font-family:Verdana;
color:blue; left: 58px">SIFOO</div>
</BODY> </HTML>
Skrip ini untuk mengeluarkan teksa pada status windows anda . Ada dua jenis iaitu teks yang bergerak ( scrolling ) dan teks yang tetap sahaja .
Letakkan
tag berikut pada laman web anda.
<html>
<head>
<script language="JavaScript">
<!-- function text(txt) { window.status = txt; }
// -->
</script>
<body onLoad="text('Teks anda disini');">
</body>
</html>
Dan tukarkan kepada teks pilihan anda di bahagian:
<body onLoad="text('Teks anda disini');">
