Laman

Rabu, 26 September 2012

Cara membuat tulisan yang mengikuti cursor di blog

Mungkin teman2 pernah berkunjung ke suatu blog lalu tiba2 cursornya teman2 diikuti oleh suatu teks. Nah, untuk membuat yang seperti itu sebenarnya gampang sekali, karena kita hanya membutuhkan kode HTML khusus membuat efek tulisan yang mengikuti cursor. Kode HTML yang saya maksud adalah kode berikut 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='T4 Belajar Blogger'.split('').reverse().join('');

var font='Verdana,Arial';
var size=5; // up to seven
var color='#FF9900';

// 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=0 height='+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>



Nah, kopi-paste kode di atas ke gadget HTML-nya teman2 lalu jangan lupa disimpan. Beberapa bagian yang bisa teman2 ganti yaitu yang berwarna biru (bisa diganti dengan tulisan apa pun), hijau (ukuran font), dan orange (yaitu warna tulisan/font, untuk kode warna bisa dilihat2 di: sini)




Semoga Bermanfaat []

Cara membuat Cursor unik

Tips Cara Membuat Cursor Bertabur Bintang Pada Blog - masih seputar tips dan trick mempercantik blog. banyak cara yang dilakukan seorang blog untuk menghias blognya sedemikian rupa guna menghasilkan suatu blog yang enak dipandang. kali ini Ageboy Blogs akan memberikan tips gimana caranya Membuat Cursor Bertabur Bintang.

Untuk tips Membuat Bintang Pada Cursor kali ini pun cukup mudah.

1. Login ke blogger.
2.Masuk ke Layout–>Page Element
3.Tambahkan gadget HTML/JavaScript
4.Pilih kode Cursor Bertabur Bintang dibawah ini.

Bintang Hijau

    <script src=”http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.hijau.js” type=”text/javascript”></script>

Bintang Ungu
    <script src=’http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.ungu.js’ type=”text/javascript”></script>

Bintang Merah
    <script src=’http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.merah.js’ type=”text/javascript”></script>

Bintang Biru
    <script src=’http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.biru.js’ type=”text/javascript”></script>

Bintang Putih
    <script src=’http://sites.google.com/site/amatullah83/js-indahnyaberbagi/bintang.putih.js’ type=”text/javascript”></script>

Pilih salah satu kode script diatas lalu simpan di widget.Cukup mudah bukan cara Membuat Cursor Bertabur Bintang. selamat mencoba..:)
Mau ada bintangnya di mesin pencari google baca juga tutorial ini Cara Membuat Blog Berbintang Di Google

Kamis, 20 September 2012

KESAN DAN PESAN OSPEK’12 ATB Is The Best



Kesan :

Ospek 2012 IstimeWa,,,
 pada saat ospek saya mendapat pengalaman baru menemukan teman-teman baru yang asikk"..sekali pun harus bersusah payah membuat kreasi tapi kami dha senang karna klompok printer tampil di acara puncak ospek.. y walau pun ndak menang tapi seneng z karna dha tampil…hehehe
walau pun jarak kampus dengan rumah lumayan jauh, tapi gak sia" akunya bangun pagi" selesai solat subuh tuk datang ke kampus, karena semuaa usaha terbayarkan  pada saat  Puncak ospek yang seru.. Terutama ajang Kreasi dari setiap kelompok, yg membuat acaranya berjalan dengan MantapPp…..

 kelompok printer like this yOo….
^_^

Pesan:

Untuk  tahun  depan mudah"an ospeknya lebih seru....
dan Lebih manakjubkan lagi..
kemudian untuk panitia ospek,,,
jangan pelit – pelit donk kakak ku sayang ama tandatangannya…
^_^

ATB is the best……..