Menu Single Horizontal Type Automatic Rotated and Displayed

Jenis Menu horizontal ini bisa dikatakan sebagai teks bar (pesan singkat) yang muncul secara otomatis dengan navigasi kiri dan Navigasi Kanan. Variasi menu / teks bar ini bisa dipakai untuk menampilkan headline Pada website/blog kita dengan berbagai variasi teks dan background.


Mau Memakai cara ini? Berikut langkah2nya


Pertama

1. Klik Page Element
2. Klik Add Gadget
3.
4. Klik plus button(+) for HTML / JavaScript(img)

5. Copy and paste kode dibawah ini

<style>
<!--
.scrollerstyle{
font-family:arial;background:#E6E6E6;border:1px solid #000000;cursor:pointer;
}
-->
</style>

<script language="javascript">

var msgs = new Array(
"Trik Blogger",
"Blogger Hack",
"Hacking",
"Kumpulan Blog Tutorial",
"Kumpulan Blog Optimization",
"Dinamic Widget Untuk Blogger",
"Menu Navigasi Untuk Blogger",
"Meningkatkan Pagerank dan Traffic SEO",
"Variasi Posting untuk Blogger",
"Variasi widgets untuk Blogger" ); // No comma after last ticker msg

var msg_url = new Array(
"http://fik-entry.blogspot.com/search/label/Tutorial",
"http://fik-entry.blogspot.com/search/label/Trik%20Blogger",
"http://fik-entry.blogspot.com/search/label/Blogger%20Hack",
"http://fik-entry.blogspot.com/search/label/Hacking",
"http://fik-entry.blogspot.com/search/label/Software",
"http://fik-entry.blogspot.com/search/label/Trafik%20Blog",
"http://fik-entry.blogspot.com/search/label/Variasi%20Widget",
"http://fik-entry.blogspot.com/search/label/Social%20Bookmark",
"http://fik-entry.blogspot.com/search/label/Optimasi%20Blog",
"http://fik-entry.blogspot.com/search/label/Ebook" ); // No comma after last ticker url

var barwidth='800px' //Enter main bar width in px or %
var setdelay=2000 //Enter delay between msgs, in mili-seconds
var mouseover_color='#000000' //Specify highlight color
var mouseout_color='transparent' //Specify default color
/////////////////////////////////////////////////////////////////////

var count=0;
var ns6=document.getElementById&&!document.all
var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1

if (ie4||ns6){
document.write('<form name="news_bar"><input type="button" value="Previous" onclick="moveit(0)" class="scrollerstyle" style="width:80px; height:50px; border-right-width:1px;" name="prev" title="Previous News"><input type="button" name="news_bar_but" onclick="goURL();" style="color:#ffffff;background:transparent; width:'+barwidth+'; height:30px; border-width:0; border-color:#000000; cursor:hand" onmouseover="this.style.background=mouseover_color" onmouseout="this.style.background=mouseout_color"><input type="button" value="next" onclick="moveit(1)" class="scrollerstyle" style="width:80px; height:50px; border-left-width:1px;" name="next" title="Next News"></form>');
}
else{
document.write('<form name="news_bar"><input type="button" value="Previous" onclick="moveit(0)">')
if (navigator.userAgent.indexOf("Opera")!=-1)
document.write('<input type="button" name="news_bar_but" onclick="goURL();" style="width:'+barwidth+'" border="0">')
else
document.write('<input type="button" name="news_bar_but" onclick="goURL();" width="'+barwidth+'" border="0">')
document.write('<input type="button" value="Next" onclick="moveit(1)"></form>')
}

function init_news_bar(){
document.news_bar.news_bar_but.value=msgs[count];
}
//moveit function by Dynamicdrive.com
function moveit(how){
if (how==1){ //cycle foward
if (count<msgs.length-1)
count++
else
count=0
}
else{ //cycle backward
if (count==0)
count=msgs.length-1
else
count--
}
document.news_bar.news_bar_but.value=msgs[count];
}

setInterval("moveit(1)",setdelay)

function goURL(){
location.href=msg_url[count];
}

init_news_bar();

</script>

Bagian yang diberi tanda keterangan, kamu dapat mengubah sesuai dengan Warna yang di inginkan.

• Warna merah, variasi huruf, warna dan border pada navigasi scroll kiri dan kanan (ubah jenis font, kode warna dan tebal border silakan diganti sesuai keinginan)
• Var barwidth='800px', lebar menu utama (silakan diganti sesuai keinginan)
• var setdelay=2000 , kecepatan perputaran/pergantian teks / menu (makin besar makin lambat - silakan diganti sesuai keinginan)
• var mouseover_color='#000000' , kode warna hover menu / teks (silakan diganti sesuai keinginan)
• value="Previous" dan value="next" , Navigasi scroll arah kiri - kanan ( bisa diganti sesuai Keinginan)
• width:80px; height:50px, lebar dan tinggi Navigasi scroll arah kiri - kanan
• Warna hijau , nama menu.teks yang dimaksud dan alamat URL menu teks secara berurutan.

Catatan:
untuk lebar menu bisa disuaikan sesuai dengan lebar kolom template (ubah lebar scroll kiri kanan dan menu / teks utama sesuai lebar kolom template)


Semoga Bermanfaat ...!

Title: Menu Single Horizontal Type Automatic Rotated and Displayed

Rating: 5.0 out of 10 based on 745 user ratings

Number of user reviews: 15

Summary: Menu Navigasi, Trik Blogger