1.
Efek gerak default
Ini tag marquee untuk efek gerak secara default/standar yaitu dari kanan kekiri
.
Tagnya :
<marquee>Teks
Anda</marquee>
2. Efek gerak ke kanan
Tagnya :
<marquee
behavior="scroll" direction="right" height="100"
scrollamount="2" width="auto">Teks
disini</marquee>
Untuk
mengganti arah teks ke kiri ganti nilai direction dengan “LEFT”, arah teks ke
atas dengan “UP” Sedangkan ke bawah dengan “DOWN”
Atribut Height maksudnya adalah tinggi area teks untuk bergerak sesuai nilai
direction sedangkan width adalah lebarnya. Silahkan ganti nilainya untuk
mencoba.
3. Efek gerak kekanan dan kekiri
Tagnya:
<marquee
behavior="alternate">Teks Kamu</marquee>
4. Efek gerak cepat
Tagnya:
<marquee
behavior="alternate" scrollamount="50">Teks
Kamu </marquee>
Ubah nilai
atribut Scrollamount dengan nilai yang kamu inginkan dan kamu coba lihat
hasilnya.
5. Efek gerak berhenti jika mouse di arahkan ke teks
Tagnya :
<marquee
behavior="alternate" onmouseover="this.stop()"
onmouseout="this.start()">Teks Kamu </marquee>
Silahkan kamu berkreasi sendiri dengan
menambahkan atribut misal pada tag marquee ke kanan, kamu bisa menambahkan
atribut scrollamount dengan nilai yang kamu inginkan untuk mengatur kecepatan
gerak teks. Pada teks turun ke bawah kamu bisa menambahkan tag
onmouseover="this.stop()" onmouseout="this.start()" yang
jika mouse di arahkan ke teks maka teks akan berhenti. Atau kamu juga bisa
mengganti teks dengan link
Al-Qur'an Online Pada Blog :
1. Login ke blogger
2. Pilih Rancangan kemudian Tambah Gadget
3. Pilih HTML/JavaScript
4. Masukan kode HTML di bawah ini
<iframe
style="overflow: auto; background-attachment: scroll; background-repeat:
no-repeat; background-position: left top; text-align: left; border: 1px solid
#cccccc; -moz-border-radius: 8px 8px 8px 8px; padding: 10px; width: 850px;
height: 900px;"
src="http://m.alquran-indonesia.com/mquran/index.php/quran"
frameborder="0"> </iframe>
Efek Love Berjatuhan 3D di Blog :
1. Login ke Blogger.
2 Pilih Tata Letak kemudian Tambah GadgetPilih HTML/JavaScript
3. Masukan kode-kode berikut ini
<marquee
behavior=scroll direction=down scrollamount=3 scrolldelay=48 height=631
style='position:absolute; left:85%; top:5px; width:15; height:631px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=2 scrolldelay=22
height=655 style='position:absolute; left:9%; top:171px; width:15;
height:655px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=6 scrolldelay=49
height=659 style='position:absolute; left:80%; top:61px; width:15;
height:659px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=5 scrolldelay=47
height=629 style='position:absolute; left:34%; top:61px; width:15;
height:629px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=6 scrolldelay=13
height=584 style='position:absolute; left:12%; top:126px; width:15;
height:584px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=6 scrolldelay=6
height=689 style='position:absolute; left:48%; top:171px; width:15;
height:689px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=4 scrolldelay=19
height=666 style='position:absolute; left:23%; top:139px; width:15;
height:666px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=4 scrolldelay=9
height=619 style='position:absolute; left:40%; top:90px; width:15;
height:619px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=4 scrolldelay=16
height=592 style='position:absolute; left:52%; top:180px; width:15;
height:592px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=6 scrolldelay=23
height=695 style='position:absolute; left:10%; top:1px; width:15;
height:695px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=4 scrolldelay=50
height=532 style='position:absolute; left:66%; top:1px; width:15;
height:532px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=6 scrolldelay=27
height=662 style='position:absolute; left:8%; top:7px; width:15;
height:662px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=3 scrolldelay=42
height=649 style='position:absolute; left:33%; top:173px; width:15;
height:649px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=3 scrolldelay=43
height=555 style='position:absolute; left:92%; top:197px; width:15;
height:555px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=6 scrolldelay=35
height=568 style='position:absolute; left:87%; top:185px; width:15;
height:568px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=4 scrolldelay=14
height=659 style='position:absolute; left:89%; top:46px; width:15;
height:659px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=6 scrolldelay=6
height=685 style='position:absolute; left:29%; top:0px; width:15;
height:685px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=2 scrolldelay=30
height=619 style='position:absolute; left:29%; top:108px; width:15;
height:619px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=2 scrolldelay=45
height=530 style='position:absolute; left:38%; top:45px; width:15; height:530px;'><img
src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
<marquee behavior=scroll direction=down scrollamount=5 scrolldelay=38
height=572 style='position:absolute; left:73%; top:129px; width:15;
height:572px;'><img src=http://dl4.glitter-graphics.net/pub/111/111944aomhvemlia.gif
border=0></marquee>
Efek Hujan Salju 3D di Blog :
1. Login ke Blogger.
2 Pilih Tata Letak kemudian Tambah GadgetPilih HTML/JavaScript
3. Masukan kode-kode berikut ini
<script>
//Here you can add your own picture for snow. Just change the url
var snowsrc="http://i13.servimg.com/u/f13/11/52/70/02/snowba10.png"
//how many snowflakes there will be (currently 12)
var no =40;
//How fast will the snow disappear (0 is never)
var hidesnowtime = 0;
//The height the snow will reach before it disappears ("windowheight"
or "pageheight")
var snowdistance = "pageheight";
///////////////////////////////End of
Settings///////////////////////////////////
var ie4up = (document.all) ? 1 : 0;
var ns6up = (document.getElementById&&!document.all) ? 1 : 0;
function iecompattest()
{
return (document.compatMode &&
document.compatMode!="BackCompat")? document.documentElement :
document.body
}
var dx, xp, yp;
var am, stx, sty;
var i, doc_width = 800, doc_height = 600;
if (ns6up)
{
doc_width = self.innerWidth;
doc_height = self.innerHeight;
}
else
if (ie4up)
{
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}
dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();
for (i = 0; i < no; ++ i)
{
dx[i] = 0;
xp[i] = Math.random()*(doc_width-50);
yp[i] = Math.random()*doc_height;
am[i] = Math.random()*20;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
if (ie4up||ns6up)
{
if (i == 0)
{
document.write("<div id=\"dot"+ i +"\"
style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY:
visible; TOP: 15px; LEFT: 15px;\"><a
href=\"http://rftactical.darkbb.com/index.htm\"><img
src='"+snowsrc+"'
border=\"0\"><\/a><\/div>");
}
else
{
document.write("<div id=\"dot"+ i +"\"
style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY:
visible; TOP: 15px; LEFT: 15px;\"><img src='"+snowsrc+"'
border=\"0\"><\/div>");
}
}
}
function snowIE_NS6()
{
doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;
doc_height=(window.innerHeight &&
snowdistance=="windowheight")? window.innerHeight : (ie4up &&
snowdistance=="windowheight")? iecompattest().clientHeight : (ie4up
&& !window.opera && snowdistance=="pageheight")?
iecompattest().scrollHeight : iecompattest().offsetHeight;
for (i = 0; i < no; ++ i)
{
yp[i] += sty[i];
if (yp[i] > doc_height-50)
{
xp[i] = Math.random()*(doc_width-am[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
}
dx[i] += stx[i];
document.getElementById("dot"+i).style.top=yp[i]+"px";
document.getElementById("dot"+i).style.left=xp[i] +
am[i]*Math.sin(dx[i])+"px";
}
snowtimer=setTimeout("snowIE_NS6()", 10);
}
function hidesnow()
{
if (window.snowtimer) clearTimeout(snowtimer)
for (i=0; i<no; i++)
document.getElementById("dot"+i).style.visibility="hidden"
}
if (ie4up||ns6up)
{
snowIE_NS6();
if (hidesnowtime>0)
setTimeout("hidesnow()", hidesnowtime*1000)
}
</script>
EFEK GELEMBUNG SABUN
<script language="javascript"
src="http://blogtrikdantips-blogspot.googlecode.com/files/bubble2.js"></script>
MEMBUAT MENU BAR
2
<li><a
href='link/URL homepage blog disini'>Home</a></li>
3
<li><a
href='link 1'>pintar </a></li>
4
<li><a
href='link 2'>judul link 2</a></li>
5
<li><a
href='link 3'>judul link 3</a></li>
6
<li><a
href='link 4'>judul link 4</a></li>
7
<li><a
href='link 5'>judul link 5</a></li>
8
<li><a
href='link 6'>judul link 6</a></li>
9 </ul>
