Trik membuat efek tulisan jatuh

trik ini didapat dari kangthymos, dilakukan pengujian di blog lab ini
Hasilnya :

Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....Huruf berjatuhan....

HTML text

Kode script :

<marquee style="z-index:2;position:absolute;left:24;top:18;font-family:Cursive;font-size:14pt;color:ffcc00;height:184;"scrollamount="3" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:244;top:111;font-family:Cursive;font-size:14pt;color:ffcc00;height:134;"direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:36;top:100;font-family:Cursive;font-size:14pt;color:ffcc00;height:123;"scrollamount="6" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:8;top:7;font-family:Cursive;font-size:14pt;color:ffcc00;height:283;"scrollamount="4" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:190;top:66;font-family:Cursive;font-size:14pt;color:ffcc00;height:442;"scrollamount="2" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:287;top:7;font-family:Cursive;font-size:14pt;color:ffcc00;height:467;"scrollamount="1" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:138;top:42;font-family:Cursive;font-size:14pt;color:ffcc00;height:87;"scrollamount="2" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:40;top:86;font-family:Cursive;font-size:14pt;color:ffcc00;height:460;"scrollamount="1" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:254;font-family:Cursive;font-size:14pt;color:ffcc00;height:209;"scrollamount="5" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:227;top:14;font-family:Cursive;font-size:14pt;color:ffcc00;height:232;"scrollamount="6" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:15;top:22;font-family:Cursive;font-size:14pt;color:ffcc00;height:305;"direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:226;top:3;font-family:Cursive;font-size:14pt;color:ffcc00;height:383;"scrollamount="4" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:83;top:66;font-family:Cursive;font-size:14pt;color:ffcc00;height:16;"scrollamount="5" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:173;top:66;font-family:Cursive;font-size:14pt;color:ffcc00;height:404;"scrollamount="6" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:224;top:91;font-family:Cursive;font-size:14pt;color:ffcc00;height:477;"scrollamount="1" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:121;top:94;font-family:Cursive;font-size:14pt;color:ffcc00;height:236;"scrollamount="2" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:15;top:32;font-family:Cursive;font-size:14pt;color:ffcc00;height:227;"direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:130;top:112;font-family:Cursive;font-size:14pt;color:ffcc00;height:196;"direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:78;top:71;font-family:Cursive;font-size:14pt;color:ffcc00;height:326;"scrollamount="3" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:12;top:117;font-family:Cursive;font-size:14pt;color:ffcc00;height:477;"scrollamount="6" direction="down">Huruf berjatuhan....</marquee><marquee style="z-index:2;position:absolute;left:49;top:25;font-family:Cursive;font-size:14pt;color:ffcc00;height:444;"scrollamount="3" direction="down">Huruf berjatuhan....</marquee><p style="position:absolute;top:500;font-family:verdana,arial,sans-serif;font-size:10px;"><a href="http://www.quackit.com/html/codes/text/">HTML text</a></p>

Trik membuat efek tulisan berjalan

Trik membuat efek tulisan berjalan atau biasa disebut efek marquee.
Contoh dan cara memberikan efek marquee pada tulisan.

• Efek marquee standar / tulisan berjalan dari kanan kekiri

Tulisan berjalan dari kanan kekiri

• kode HTML ditambahkan sebelum dan sesudah tulisan yaitu :

• <marquee>Tulisan berjalan dari kanan kekiri</marquee>
• Efek marquee dengan kecepatan berbeda-beda

    Tulisan berjalan dari kanan kekiri dengan kecepatan 1

    Tulisan berjalan dari kanan kekiri dengan kecepatan 2

    Tulisan berjalan dari kanan kekiri dengan kecepatan 3

    Tulisan berjalan dari kanan kekiri dengan kecepatan 4

• Untuk yang lebih cepat lagi

    Tulisan berjalan dari kanan kekiri dengan cepat

• Kode HTMLnya :

• <marquee scrollamount="1">Tulisan berjalan dari kanan kekiri dengan kecepatan 1</marquee>

• <marquee scrollamount="2">Tulisan berjalan dari kanan kekiri dengan kecepatan 2</marquee>

• <marquee scrollamount="3">Tulisan berjalan dari kanan kekiri dengan kecepatan 3</marquee>

• <marquee scrollamount="4">Tulisan berjalan dari kanan kekiri dengan kecepatan 4</marquee>

• Untuk yang lebih cepat lagi kodenya  :

• <marquee scrollamount="80">Tulisan berjalan dari kanan kekiri dengan kecepatan 80</marquee>

• Sedangkan trik agar tulisan berjalan dari kiri kekanan

Tulisan berjalan dari kiri kekanan
 

• Kode HTMLnya :

• <marquee scrollamount="4"direction="right">Tulisan berjalan dari kiri kekanan</marquee>

Kode right bisa diganti left,up atau down untuk efek yang diinginkan

• Trik efek tulisan berjalan kekanan dan kekiri / bolak-balik

Tulisan bolak balik kanan kiri kanan kiri

• Kode HTMLnya :

• <marquee behavior="alternate">Tulisan bolak balik kanan kiri kanan kiri</marquee>

• Trik membuat tulisan bergerak Zig-Zag

Tulisan ini bergerak Zig-Zag

• Kode HTMLnya :

• <br/><center><marquee behavior="alternate"direction="up"width"50%"><marquee direction="right"behavior="alternate">Tulisan ini bergerak Zig-Zag</b></marquee></marquee></center>

• Trik memberikan efek warna latar pada tulisan bolak balik

Tulisan berlatar Warna Merah

Tulisan berlatar Warna Kuning

Tulisan berlatar Warna Hijau

Tulisan berlatar  Biru berjalan  dimulai dari bawah menuju  ke atas  kemudian  kembali  kebawah

Tulisan berlatar  Kuning jeruk  berjalan dimulai  dari  atas menuju  kebawah  dan  kembali keatas

• Kode HTMLnya :

• <marquee behavior="alternate"direction="right"bgcolor="red">merah</marquee>

• <marquee behavior="alternate"direction="left"bgcolor="yellow">kuning</marquee>

• <marquee behavior="alternate"direction="right"bgcolor="green">hijau</marquee>

• <marquee behavior="alternate"direction="up"bgcolor="blue">biru</marquee>

• <marquee behavior="alternate"direction="down"bgcolor="orange">kuning jeruk</marquee>

• Keterangan

• Tulisan Red, yellow,green,... adalah tampilan warna latar / background yang ingin ditampilkan.

• Dapat pula diisi dengan kode warna HTML misal #adff2f untuk warna latar greenyellow

Warna latar tulisan dengan bgcolor #adff2f

SEMOGA BERMANFAAT

Trik Membuat Efek Pelangi di Postingan Blog

Trik membuat efek pelangi di postingan Blog
Contoh:

CONTOH TULISAN PELANGI

Dengan bantuan widget ,tambahkan script berikut ke widget baru

<script
src="http://sites.google.com/site/copycatgroup/Home/jsfile/rainbowtext.js">
</script>

Setelah langkah tersebut dijalankan, anda tinggal menulis postingan dengan catatan disetiap menulis postingan yang akan diberi efek pelangi, tambahkan code script berikut

<span class="rainbow_text">TEXT</span>

TEXT---> Diganti tulisan yang akan diposting
Selamat Mencoba

Trik Hilang Muncul Navigation Bar Blogger

Trik memodifikasi Navigation Bar pada blogger agar samar ataupun hilang dan muncul ketika cursor diarahkan.
Untuk contoh klik disini.
code scriptnya sebagai berikut

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$("#navbar").fadeTo("slow",
0.1
);
$("#navbar").hover(function(){
$(this).fadeTo("slow",
1.0
);
},function(){
$(this).fadeTo("slow",
0.1
);
});
});
</script>

Ket :
0.1 ---> Efek transparan sebesar 90% bisa dirubah 0.0 --->100%
1.0 --->Bisa dirubah ke 0.75 untuk mendapatkan efek transparan sebesar 25%

Langkah-langkahnya sebagi berikut
1. Login ke Blogger / Blogspot
2. Layout ---> Edit HTML
3. Cari kode </head>
4. Letakan code script tersebut diatas kode </head>.
5. Simpan dan lihat hasilnya

Trik Membuat Efek ScreenSaver pada Blog

Trik ini menampilkan efek screen saver ketika suatu Blog yang di buka sedang tidak di pergunakan semisal ditinggal sementara oleh penggunanya.
Dapat bermanfaat juga sebagai penghematan energi.

Untuk contoh ---> Silahkan melihat dengan membiarkan sebentar dan tidak menggerakan mouse anda.

Bagaimana ?
Triknya yaitu :
1. Login ke Blogger/Blogspot
2. Masuk ke Layout--->Edit HTML
3. Temukan code <:head>
4. Letakan script dibawah ini tepat 

<script language='javascript' src='http://pageprotection.googlecode.com/files/savetheenvironment.js' type='text/javascript'/>

 5. Letakan tepat dibawah code <:head>
 6. Simpan dan lihat hasilnya.

Trik Menghilangkan Navigation Bar Blogger

Navigation Bar Blogger biasa terlihat disebelah atas tampilan suatu Blog di Blogspot sebagai alat bantu Blogger.
Contoh :

Bagaimana cara menghilangkan Navigation Bar diatas.
Triknya yaitu :
1. Login ke Blogger/Blogspot
2. Pilih Layout --> Edit HTML
3. Cari tag head (dengan bantuan Ctrl+F, isikan  kalimat head dikolom Find akan lebih cepat ditemukan)
    Contohnya sebagai berikut setelah ditemukan :

4. Isikan atau copy paste script berikut

#navbar-iframe {
display: none !important;
}

5. Letakkan diatas atau sebelum---> /*Variable definitions
    Contohnya seperti berikut setelah ditambahkan script :

 <--------- Script tambahan





6. Lalu simpan / save. 
7. Terbitkan Entri dan lihat hasilnya

Trik Cursor diikuti Tulisan

Trik Cursor diikuti tulisan :
Cara pertama, script kode dibawah ditambahkan pada elemen sidebar
Cara kedua, cari kode </head> pada script template
Copy paste script dibawah ini

<script>
//mouse
//Circling text trail-Tim Tilton
//Website: http://www.tempermedia.com/
//Visit http://www.dynamicdrive.com for this script and more
function cursor_text_circle(){
// your message here
var msg='
tulis teks disini
'.split('').reverse().join('');
var font='Verdana,Arial';
var size=3; // up to seven
var color='#ff0000';
// This is not the rotation speed, its the reaction speed, keep low!
// Set this to 1 for just plain rotation w/out drag
var speed=.3;
// This is the rotation speed, set it negative if you want
// it to spin clockwise
var rotation=-.2;
// Alter no variables past here!, unless you are good
//---------------------------------------------------
var ns=(document.layers);
var ie=(document.all);
var dom=document.getElementById;
msg=msg.split('');
var n=msg.length;
var a=size*13;
var currStep=0;
var ymouse=0;
var xmouse=0;
var props="<font face="+font+" size="+size+" color="+color+">";
if (ie)
window.pageYOffset=0
// writes the message
if (ns){
for (i=0; i < n; i++)
document.write('<layer name="nsmsg'+i+'" top=0 left=0height='+a+' width='+a+'><center>'+props+msg[i]+'</font></center></layer>');
}
else if (ie||dom){
document.write('<div id="outer" style="position:absolute;top:0px;left:0px;z-index:30000;"><div style="position:relative">');
for (i=0; i < n; i++)
document.write('<div id="iemsg'+(dom&&!ie? i:'')+'" style="position:absolute;top:0px;left:0;height:'+a+'px;width:'+a+'px;text-align:center;font-weight:normal;cursor:default">'+props+msg[i]+'</font></div>');
document.write('</div></div>');
}
(ns)?window.captureEvents(Event.MOUSEMOVE):0;
function Mouse(evnt){
ymouse = (ns||(dom&&!ie))?evnt.pageY+20-(window.pageYOffset):event.y; // y-position
xmouse = (ns|| (dom&&!ie))?evnt.pageX+20:event.x-20; // x-position
}
if (ns||ie||dom)
(ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse;
var y=new Array();
var x=new Array();
var Y=new Array();
var X=new Array();
for (i=0; i < n; i++){
y[i]=0;
x[i]=0;
Y[i]=0;
X[i]=0;
}
var iecompattest=function(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body;
}
var makecircle=function(){ // rotation properties
if (ie) outer.style.top=iecompattest().scrollTop+'px';
currStep-=rotation;
for (i=0; i < n; i++){ // makes the circle
var d=(ns)?document.layers['nsmsg'+i]:ie? iemsg[i].style:document.getElementById('iemsg'+i).style;
d.top=y[i]+a*Math.sin((currStep+i*1)/3.8)+window.pageYOffset-15+(ie||dom? 'px' : '');
d.left=x[i]+a*Math.cos((currStep+i*1)/3.8)*2+(ie||dom? 'px' : ''); // remove *2 for just a plain circle, not oval
}
}
var drag=function(){ // makes the resistance
y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed);
x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed);
for (var i=1; i < n; i++){
y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed);
x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed);
}
makecircle();
// not rotation speed, leave at zero
setTimeout(function(){drag();},10);
}
if (ns||ie||dom)
if ( typeof window.addEventListener != "undefined" )
window.addEventListener( "load", drag, false );
else if ( typeof window.attachEvent != "undefined" )
window.attachEvent( "onload", drag );
else {
if ( window.onload != null ) {
var oldOnload = window.onload;
window.onload = function ( e ) {
oldOnload( e );
drag();
};
}
else
window.onload = drag;
}
}
cursor_text_circle();
</script>


Ganti tulisan yang berwarna kuning dengan tulisan yang anda inginkan
Selamat mencoba.

Trik membuat Link Exchange

Trik membuat kotak banner link exchange seperti dibawah :

1. Pertama-tama login ke Blogger Pilih layout--->Page element 

2. Klik add Gadget 

3. Pilih HTML/JavaScript

Isi atau Copy Paste dengan Kode Script dibawah ini :

Kode/teks yang berwarna merah adalah lebar kotak
Kode/teks yang berwarna kuning adalah link blog ini,diganti dengan nama blogmu
Kode/teks yang berwarna hijau diganti dengan alamat gambar serta ukuran banner mu
Alamat biasanya disimpen di photobucket
bagi yang belum punya banner bisa membuat banner secara online disini dan disimpan di photobucket