MEMBUAT TOMBOL BACK TO TOP

Back To Top atau dalam bahasa Indonesianya adalah kembali keatas adalah gadget berbentuk tombol yang jika diklik akan membawa anda ke tampilan paling atas di blog anda. berikut ini langkah membuatnya:

1. Login ke Blogger.
2. Masuk kehalaman Tata Letak.
3. Klik Tambahkan Gadget di area Sidebar blog atau di area Footer nya.
4. Cari Gadget HTML/JavaScript dan klik.
5. Kosongkan judul dan masukkan kode Script dibawah ini.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" > var scrolltotop={ //startline: Integer. Number of pixels from top of doc scrollbar is scrolled before showing control //scrollto: Keyword (Integer, or "Scroll_to_Element_ID"). How far to scroll document up when control is clicked on (0=top). setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]}, controlHTML: '<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCmGSRLPi0VLX-PV2UkKtOkWYRnbQjonFlLm7V7ey_LERocG51bhjs4Bl5fOp_HCWjETLWE5fsubcZcXznqXBUaNvjMmmH2N5LSqodoG4JqIAFAvPHuz-3wPJJ-XWbvm2l2_alLnY3jcE/s400/Back-to-top.png" />', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol" controlattrs: {offsetx:5, offsety:5}, //offset of control relative to right/ bottom of window corner anchorkeyword: '#top', //Enter href value of HTML anchors on the page that should also act as "Scroll Up" links state: {isvisible:false, shouldvisible:false}, scrollup:function(){ if (!this.cssfixedsupport) //if control is positioned using JavaScript this.$control.css({opacity:0}) //hide control immediately after clicking it var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto) if (typeof dest=="string" && jQuery('#'+dest).length==1) //check element set by string exists dest=jQuery('#'+dest).offset().top else dest=0 this.$body.animate({scrollTop: dest}, this.setting.scrollduration); }, keepfixed:function(){ var $window=jQuery(window) var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety this.$control.css({left:controlx+'px', top:controly+'px'}) }, togglecontrol:function(){ var scrolltop=jQuery(window).scrollTop() if (!this.cssfixedsupport) this.keepfixed() this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false if (this.state.shouldvisible && !this.state.isvisible){ this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0]) this.state.isvisible=true } else if (this.state.shouldvisible==false && this.state.isvisible){ this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1]) this.state.isvisible=false } }, init:function(){ jQuery(document).ready(function($){ var mainobj=scrolltotop var iebrws=document.all mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body') mainobj.$control=$('<div id="topcontrol"> '+mainobj.controlHTML+'</div> ') .css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'}) .attr({title:'Scroll Back to Top'}) .click(function(){mainobj.scrollup(); return false}) .appendTo('body') if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='') //loose check for IE6 and below, plus whether control contains any text mainobj.$control.css({width:mainobj.$control.width()}) //IE6- seems to require an explicit width on a DIV containing text mainobj.togglecontrol() $('a[href="' + mainobj.anchorkeyword +'"]').click(function(){ mainobj.scrollup() return false }) $(window).bind('scroll resize', function(e){ mainobj.togglecontrol() }) }) } } scrolltotop.init() </script>


6. Klik tombol Simpan dan lihat blog anda.

 

Hasil Jadi Back To Top

EFEK WARNA BERKEDIP PADA LINK

Warna Berkedip Pada Link

Mengganti atau memberi warna pada teks yang berisi link adalah hal yang biasa. Bagaimana jika warna link berubah-ubah layaknya lampu LED yang berkedap-kedip? Anda bisa menampilkan efek tersebut pada halaman blogger hanya dengan menambah beberapa baris kode javascript.

Baik langsung kita mulai saja membuat Efek Warna Berkedip Pada Link dengan mengikuti langkah dibawah ini.

1. Login ke Dashboard blogger.
2. Berikurnya buka halaman Template >> Edit HTML.
3. Cari baris kode: </head>.
4. Copy semua kode script dibawah ini dan Paste diatas baris kode: </head>.
<script type='text/javascript'> //<![CDATA[ var blink_ = 20; if (document.getElementById) window.onerror=new Function("return true") var objek; var nilai_1 = 0; var Nilai_2 = 0; var Nilai_3 = 128; var Nilai_4 = 255; var bersih; var waktu; if (document.all) { document.onmouseover = acak_warnaAnchor; document.onmouseout = stop_acakAnchor; } else if (document.getElementById) { document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT); document.onmouseover = Mozilla_acak_warnaAnchor; document.onmouseout = Mozilla_stop_acakAnchor; } function acak_warna(obj) { if (nilai_1 == 0) { nilai_1 = 1; if (obj) objek = obj; else objek = event.srcElement; bersih = objek.style.color; waktu = setInterval("ganti_warna()",100); } } function stop_acak() { if (nilai_1) { objek.style.color = bersih; clearInterval(waktu); nilai_1 = 0; } } function acak_warnaAnchor() { if (nilai_1 == 0) { var obj = event.srcElement; while (obj.tagName != 'A' && obj.tagName != 'BODY') { obj = obj.parentElement; if (obj.tagName == 'A' || obj.tagName == 'BODY') break; } if (obj.tagName == 'A' && obj.href != '') { objek = obj; nilai_1 = 1; bersih = objek.style.color; waktu = setInterval("ganti_warna()",100); } } } function stop_acakAnchor() { if (nilai_1) { if (objek.tagName == 'A') { objek.style.color = bersih; clearInterval(waktu); nilai_1 = 0; } } } function Mozilla_acak_warnaAnchor(e) { if (nilai_1 == 0) { obj = e.target; while (obj.nodeName != 'A' && obj.nodeName != 'BODY') { obj = obj.parentNode; if (obj.nodeName == 'A' || obj.nodeName == 'BODY') break; } if (obj.nodeName == 'A' && obj.href != '') { objek = obj; nilai_1 = 1; bersih = obj.style.color; waktu = setInterval("ganti_warna()",100); } } } function Mozilla_stop_acakAnchor(e) { if (nilai_1) { if (objek.nodeName == 'A') { objek.style.color = bersih; clearInterval(waktu); nilai_1 = 0; } } } function ganti_warna() { objek.style.color = buat_warna(); } function buat_warna() { if (Nilai_3 == 0) { elmR = Nilai_4; elmG = Nilai_4; elmB = Nilai_4; } else { t1 = Nilai_4; t2 = (255 - Nilai_3) * Nilai_4 / 255; t3 = Nilai_2 % 60; t3 = (t1 - t2) * t3 / 60; if (Nilai_2 < 60) { elmR = t1; elmB = t2; elmG = t2 + t3; } else if (Nilai_2 < 120) { elmG = t1; elmB = t2; elmR = t1 - t3; } else if (Nilai_2 < 180) { elmG = t1; elmR = t2; elmB = t2 + t3; } else if (Nilai_2 < 240) { elmB = t1; elmR = t2; elmG = t1 - t3; } else if (Nilai_2 < 300) { elmB = t1; elmG = t2; elmR = t2 + t3; } else if (Nilai_2 < 360) { elmR = t1; elmG = t2; elmB = t1 - t3; } else { elmR = 0; elmG = 0; elmB = 0; } } elmR = Math.floor(elmR).toString(16); elmG = Math.floor(elmG).toString(16); elmB = Math.floor(elmB).toString(16); if (elmR.length == 1) elmR = "0" + elmR; if (elmG.length == 1) elmG = "0" + elmG; if (elmB.length == 1) elmB = "0" + elmB; Nilai_2 = Nilai_2 + blink_; if (Nilai_2 >= 360) Nilai_2 = 0; return '#' + elmR + elmG + elmB; } //]]> </script>
5. Simpan Perubahannya
6. Buka ulang halaman blog anda dan letakkan kursor mouse pada semua link yang ada dihalaman blognya. Teks yang memiliki link akan berkedap-kedip dengan berganti warna secara acak.