mouse

Tampilkan postingan dengan label buat blog. Tampilkan semua postingan
Tampilkan postingan dengan label buat blog. Tampilkan semua postingan

Membuat Widget Earth Hour Di Blog

http://farrasoct.files.wordpress.com/2010/03/2009earthhour-jkt-off.jpg?w=451&h=257

Sobat (Soto Babat) Brototers! Mumpung Eventnya pas nih, ya udah aku mau ngajarin bikin Widget Earth Hour. Widget ini bisa menghemat energi lho! Karena Warna Terang di Blog bikin boros listrik. dengan Wigdet ini Background Blog kita bisa di ubah menjadi Gelap Gulita.. awalnya widget ini terinspirasi dari Widget mengubah-ngubah background. ya jadi terinspirasi Earth Hour. ini widget 100% asli Brotot lho.. creditsnya mohon jangan di hapus..
Klik Deh Pada Lampu yang mati. nanti Blognya jadi Hitam. kalo klik lampu yang nyala nanti jadi seperti biasa lagi blognya. 
Bagaimana Cara Membuatnya? Cekidot.

1. Login Ke Blog >> Rancangan >> Tata Letak
2. Klik Tambah Gadget >> HTML/Javascript
3. Masukkan HTML ini :
<center>
<script type="text/javascript">
function bgChange(bg)
{document.body.style.background=bg;}
</script>
<---------Kata-Kata Bebas---------/>
<br/><img alt="http://aux.iconpedia.net/uploads/10875870971013046993.png" onclick="bgChange('#000000')" src="http://aux.iconpedia.net/uploads/10875870971013046993.png" /><img alt="http://aux.iconpedia.net/uploads/1540998406962263282.png" onclick="bgChange('Green')" src="http://aux.iconpedia.net/uploads/1540998406962263282.png" />
<span style="font-size: x-small;">Mau Widget ini? <a href="http://www.adjiebrotot.blogspot.com/2011/03/membuat-widget-earth-hour-di-blog.html">Click Here</a>!</span></center>
4. Tulisan Warna Biru diganti Kata-Kata sesuka kamu. misalkan : Hemat Energi dengan Klik Gambar Lampu Mati. atau Matikan Lampu Blog untuk hemat Energi.

5. Tulisan Green diganti dengan warna background blog kamu dalam bahasa inggris. kalo backgroundnya biru tulis blue, kalo merah tulis red, kalo mau lebih detail pake Kode HTML seperti #0000FF, #FFD700, #008000, dll untuk daftar lengkapnya lihat saja disini.

6. SAVE. Kalo Ga Ngerti Tanya aja dibawah ya..

Membuat Animasi Teks Terketik Otomatis


Ingin Membuat Animasi Teks terketik otomatis? caranya gimana? mudah kok... kita cuma butuh sedikit kode javascript disini. Animasi Tersebut bisa ditaruh di postingan blog sebagai pelengkap posting, atau di dekat header/sidebar sebagai pesan bagi pengunjung. bisa ditaruh dimana saja bahkan di saku anda sekalipun. Berikut Contohnya:

Teks ini terketik sendiri walaupun anda tidak menyentuh keyboard. bahkan jika anda sedang tidur sekalipun, teks ini akan terus mengetik, mengetik, dan mengetik tanpa henti sampai hari kiamat tiba. tapi sayangnya teks ini terlalu panjang saking panjangnya sampai memenuhi halaman posting di adjie brotot blog karena memenuhi maka javascript yang digunakan akan semakin banyak, oh iya, teks ini dibuat dengan javascript bukan dengan HTML semoga anda mengerti dan selamat menyaksikan tutoial ini dengan seksama, tapi sebelumnya ke kamar mandi dulu bagi yang kebelet dan |

Oke, Langsung saja. ini dia Kodenya:

<script language="JavaScript">
var text="TEKS ANDA DISINI";
var delay=10;
var currentChar=1;
var destination="[none]";
function type()
{
//if (document.all)
{
var dest=document.getElementById(destination);
if (dest)// && dest.innerHTML)
{
dest.innerHTML=text.substr(0, currentChar)+"<blink>_</blink>";
currentChar++;
if (currentChar>text.length)
{
currentChar=1;
setTimeout("type()", 5000);
}
else
{
setTimeout("type()", delay);
}
}
}
}
function startTyping(textParam, delayParam, destinationParam)
{
text=textParam;
delay=delayParam;
currentChar=1;
destination=destinationParam;
type();
}
</script>
<b></b><br />
<div #ff0000;="" 0px;"="" 10px="" arial;="" color:="" font:="" id="textDestination" margin:="">
</div>
<script language="JavaScript">
javascript:startTyping(text, 50, "textDestination");
</script>

Penjelasan:
MERAH=tuliskan teks anda disitu.
BIRU=selang waktu delay teks sebelum terketik dari awal lagi
KUNING=selang waktu antar karakter
_ (underscore)=karakter dibelakang teks. boleh diganti menjadi | atau ...

Boleh dikombinasikan sesuka hati anda.

Template Blog Chibi Transparent V 1.0

Download Template :
Click Here
View Live Demo :


Design and Creator : Muhammad Fadhil Rachman & Muhammad Iqbal K

Last Update             :  Kamis, 4 Agustus 2011

Template Name       : Chibi Transparent Version 1.0



Fiture :
[-] Chibi Transparent Template 
[-] Chibi Blue Matrix Background
[-] Music Player
[-] Auto Read More (Jarang ada)

Tutorial :
1. Download dulu dari MFR Data
2. Extract file .exe menjadi folder.
3. Masuk ke Blogger kamu.
4. Lalu menuju "Rancangan".
5. Centang "Expand Template Widget"
6. Pada Backup/Restore Template, pilihlah browse.
7. Ambil file "Chibi Transparent V. 1.0" dan unggah.
8. Jika ada Notice pilih "Pertahankan" dan selesai.

Cara membuat link bersinar Pada Blog


Kali ini saya akan sharing ilmu baru lagi yaitu Cara membuat link bersinar.Apa itu link bersinar?link bersinar maksudnya adalah link yang jika didekati cursor akan keluar bintang-bintang di sekelilingnya pasti kalian udah pada penasaran kan.yaudah kalo gitu langsung aja kita praktekin tapi sebelum itu kalian harus follow blog saya dulu hehehehe karena apa? karena dengan mem-follow blog saya anda akan tau kalo ada postingan baru yang menarik lagi oke kalo gitu kita mulai:

1.Login ke akun blogger anda
2.Pilih tab rancangan
3.Pilih Edit html 
4.Cari kode </head> (gunakan f3 agar lebih mudah mencari)
5.Kalo udah ketemu letakkan kode dibawah ini diatas kode </head>
  
<style>
a:hover { text-decoration:blink; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvbtoQGoj_t0L89pfAML_Lbysy2WwACaFV2yKJYHWNoI8GDpvbLUFJklR99JiG1TJGcb11ZGlWUAPwAvuS3rzsasJafc5Isw2HdF1ioEg14NiO9mu2U2J_yD6fnaFyUFt3XY0H8rJH78M/s1600/blink.gif); }
</style>

pasang loading di blog

bicara tentang blog lagi yuuk'
sekarang mari kita belajar pasang "LOADING di Blog"


-pasang loading?? di blog??
-wew ada-ada aja bingung

ya jelaslah ada-ada aja.. masak gak ada menjulurkan lidah

Ok langsung aja ya...
  • yang pertama login dulu..
  • Rancangan
  • Edit HTML
  • masukkan kode di bawah ini di atas kode </head>
<script src='http://code.jquery.com/jquery-1.5.min.js' type='text/javascript'/>
<script src='http://blogger-loader.googlecode.com/files/queryLoaderpre.js'
type='text/javascript'/>  
  • selanjutnya masukkan kode berikut di atas kode </body> 
<script>
QueryLoader.selectorPreload = &quot;body&quot;;
QueryLoader.init();
</script>  
  • dan dilanjutkan dengan memasukkan kode di bawah ini di atas kode ]]></b:skin> 
.QOverlay {
background-color: #000000; /* warna background saat blog anda di loading */
z-index: 9999;
}

.QLoader {
background-color: #CCCCCC; /* warna bar loading */
height: 1px;
}

.QAmt {
color:#FF530D; /* warna angka persentase saat loading */
font-size:50px;
font-weight:bold;
line-height:50px;
height:50px;
width:100px;
margin:-60px 0 0 -50px;
}
  • kalo udah tinggal di simpan
    
    ok selamat mencoba dan semoga berhasil..

Cara Bikin Text Mengikuti Cursor


  • Pertama²..
    Baca Bismillah atau sesuai kepercayaan masing² :p
  • Ketiga..
    Klik Rancangan
  • Keempat..
    Klik Edit HTML
    Tekan Ctrl + F pada browser kamu langsung keluar mesin pencari, lalu tulis</head> di kolom browser Ctrl + F tadi..
  • Kelima..
    Setelah Ketemu </head> copy script dibawah ini !!


    <style   
    type='text/css'>
    #outerCircleText
      {
    font-style: italic;
    font-weight: bold;
    font-family:   
    &#39;comic sans ms&#39;, verdana, arial;
    color:  #BD3C28F;
    
    position: absolute;top:  
    0;left: 0;z-index: 3000;cursor: default;}
    #outerCircleText  div  
    {position: relative;}
    #outerCircleText
      div div {position: absolute;top: 0;left: 0;text-align: center;}
    
    </style>
    <script   
    type='text/javascript'>
    //<![CDATA[
    
    ;(function(){
    
    //  hehehe... (QUOTED  
    STRING)
    var msg = "Cyber";
    
    
    // Set font's style size 
     for calculating dimensions
    //  
    Set to number of desired pixels font size (decimal and negative numbers 
     not allowed)
    var size = 25;
    
    // Set both to 1 for  
    plain circle, set one of them to 2 for oval
    //  Other numbers &  
    decimals can have interesting effects, keep these low (0 to 3)
    var  circleY = 0.75; var 
     circleX = 2;
    
    // The larger this  
    divisor, the smaller the spaces between letters
    //  (decimals allowed, 
    not  negative numbers)
    var  
    letter_spacing = 5;
    
    // The larger this  
    multiplier, the bigger the circle/oval
    //  (decimals allowed, 
    not  negative numbers, some rounding is applied)
    var  diameter = 10;
    
    // Rotation speed, set it
      negative if you want it to spin clockwise (decimals allowed)
    var  rotation = 0.4;
    
    // This is not the  
    rotation speed, its the reaction speed, keep low!
    //  Set this to 1 or a  
    decimal less than one (decimals allowed, not negative numbers)
    var  speed = 0.3;
    
    // BERHENTI NGEDITNYA..! 
     Parantos cicing di dieu! Ulah diteraskeun..! //
    
    if  
    (!window.addEventListener && !window.attachEvent ||  
    !document.createElement) return;
    
    msg = msg.split('');
    var n  = msg.length - 1, a
      = Math.round(size * diameter * 0.208333), currStep = 20,
    ymouse  = a * circleY +  
    20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
    o =  
    document.createElement('div'), oi = document.createElement('div'),
    b =  document.compatMode 
     && document.compatMode != "BackCompat"? 
    document.documentElement  :
    
    document.body,
    
    mouse = function(e){
    e = e  || window.event;
    ymouse = !isNaN(e.pageY)?
      e.pageY : e.clientY; // y-position
    xmouse = !isNaN(e.pageX)?  e.pageX : e.clientX; // x-position
    },
    
    makecircle  = function(){
      // rotation/positioning
    if(init.nopy){
    o.style.top  = (b ||  
    document.body).scrollTop + 'px';
    o.style.left = (b ||  document.body).scrollLeft + 'px';
    };
    currStep  -= rotation;
    for (var d, i = n; i >
      -1; --i){ // makes the circle
    d =  document.getElementById('iemsg' + i).style;
    d.top  = Math.round(y[i] +
      a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) +
    
    'px';
    d.left  = Math.round(x[i]
     +  a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
    };
    },
    
    drag  = function(){ //  
    makes the resistance
    y[0] = Y[0]
      += (ymouse - Y[0]) * speed;
    x[0]
      = X[0] += (xmouse - 20 - X[0]) * speed;
    for  (var i = n; i > 
    0;  --i){
    y[i] = Y[i] += (y[i-1] -
      Y[i]) * speed;
    x[i] = X[i]
     += (x[i-1] -  X[i]) * speed;
    };
    makecircle();
    },
    
    init  = function(){ //  
    appends message divs, & sets initial values for positioning arrays
    if(!isNaN(window.pageYOffset)){
    ymouse  +=  
    window.pageYOffset;
    xmouse +=  
    window.pageXOffset;
    } else  
    init.nopy = true;
    for (var d,
      i = n; i > -1; --i){
    d = 
     document.createElement('div'); d.id = 'iemsg' + i;
    d.style.height  =  
    d.style.width = a + 'px';
    d.appendChild(document.createTextNode(msg[i]));
    oi.appendChild(d);  y[i] =
      x[i] = Y[i] = X[i] = 0;
    };
    o.appendChild(oi);  
    document.body.appendChild(o);
    setInterval(drag,
      25);
    },
    
    ascroll = function(){
    ymouse  +=  
    window.pageYOffset;
    xmouse +=  
    window.pageXOffset;
    window.removeEventListener('scroll',
      ascroll, false);
    };
    
    o.id = 'outerCircleText';
      o.style.fontSize = size + 'px';
    
    if  
    (window.addEventListener){
    window.addEventListener('load',
      init, false);
    document.addEventListener('mouseover',
      mouse, false);
    document.addEventListener('mousemove',
      mouse, false);
    if  
    (/Apple/.test(navigator.vendor))
    window.addEventListener('scroll',  ascroll, false);
    }
    else if  
    (window.attachEvent){
    window.attachEvent('onload',
      init);
    document.attachEvent('onmousemove',
      mouse);
    };
    
    })();
    //]]>
    </script>
     
     
    nah, text Cyber nya ganti/edit jadi nama kamu atau terserah kamu..
    paste Script ini diatas text </head>

Posting di Blog Lewat Facebook (via Blog it )


Rasanya udah lama sekali aku gak posting di blog ini, terimakasih buat pengunjung yang masih setia dan mengharapkanku untuk terus menulis di blog ini.

Kali ini aku mau share tentang aplikasi Facebook yang memungkinkan kita untuk mennerbitkan postingan melalui akun facebook kita. Mungkin hal ini sedikit memudahkan kalian yang punya akun Facebook (hari gini siapa sih yang gak punya Facebook?) supaya tidak harus langsung login ke blogger untuk menerbitkan postingan.

Okay silahkan kalian login dulu ke Facebook dan Blogger menggunakan akun kalian masing-masing.
Jika sudah dalam keadaan login silahkan kunjungi Blog it Type Pad atau ke alamat http://apps.facebook.com/blogittypepad/

  • Akan muncul halaman konfirmasi dari Facebook, klik Allow untuk melanjutkan
tampilan Blog it Type Pad
  • Lalu saat muncul halaman add account pilih Blogger dan klik tombol add account
  • Kamu akan diminta untuk mengotorisasi blogger kamu, klik tombol Authorize Blogger Account
  • Setelah itu akan muncul halaman konfirmasi dari Google/Blogger klik tombol berikan akses untuk melanjutkan
  • Nah kita akan dibawa kembali ke halaman edit blogger account, pilihlah blog mana yang ingin dihubungkan dengan facebook
  • Jika berhasil akan muncul konfirmasi seperti ini
  • Sekarang adalah cara membuat postingan lewat aplikasi tersebut
  • Klik Tab "post to Blog"
  • Berikut adalah tampilan post editornya
  • Tunggu sampai checklist paling bawah muncul, baru klik tombol post
  • Jika post kamu berhasil diterbitkan maka akan muncul halaman seperti ini
Catatan: Tambahkan alamat http://apps.facebook.com/blogittypepad/ pada bookmark kamu biar lebih gampang mengaksesnya, atau smpan aplikasi ini di akun facebook kamu
Semoga bermanfaat!!

 

Feedjit

Featured Posts