Gadget Slide Show Tulisan







Contoh



Back To Menu


Kode


CSS

<style type="text/css">
#nbshowtulisan{
background: yellow;
color: #222222;
font-size: 25px;
}
</style>

*Teks berwarna merah bisa diganti sesuai selera.

Untuk warna bisa dilihat di HTML Color Dan Macam-Macam Warna

font-size adalah ukuran huruf. Semakin besar nilainya, semakin besar ukurannya.



HTML dan Javascript

<div style="left: 0px; position: relative; top: 0px;">
<span id="nbshowtulisan" style="padding:5px;left:0pt;position:absolute;top:0pt;clip:rect(0px, 0px, auto, 0px);line-height:30px;"></span>
</div>

<script type='text/javascript'>
//<![CDATA[
//nanoyulianto.blogspot.com/2010/07/slide-show-tulisan.html
var nn=new Array()

nn[0]='Selamat Datang di Blog Nano Yulianto'
nn[1]='Selamat Membaca Tutorial Ini'
nn[2]='Semoga Bermanfaat dan Salam Blogger'

var tickdelay=3000 //waktu tunda buat teks or delay btw messages
var highlightspeed=10

////Jangan Edit sehabis garis ini/Don't edit pass this line////////////////

var currentmessage=0
var clipwidth=0

function changetickercontent(){
crosstick.style.clip="rect(0px 0px auto 0px)"
crosstick.innerHTML=nn[currentmessage]
highlightmsg()
}

function highlightmsg(){
var msgwidth=crosstick.offsetWidth
if (clipwidth<msgwidth){
clipwidth+=highlightspeed
crosstick.style.clip="rect(0px "+clipwidth+"px auto 0px)"
beginclip=setTimeout("highlightmsg()",20)
}
else{
clipwidth=0
clearTimeout(beginclip)
if (currentmessage==nn.length-1) currentmessage=0
else currentmessage++
setTimeout("changetickercontent()",tickdelay)
}
}

function start_ticking(){
var nb=0;
crosstick=document.getElementById? document.getElementById("nbshowtulisan") : document.all.highlighter
crosstickParent=crosstick.parentNode? crosstick.parentNode : crosstick.parentElement
if (parseInt(crosstick.offsetHeight)>0)
crosstickParent.style.height=crosstick.offsetHeight+'0px'
else
setTimeout("crosstickParent.style.height=crosstick.offsetHeight+'0px'",100)
changetickercontent()
}

if (document.all || document.getElementById)
window.onload=start_ticking

//]]>
</script>

*Teks berwarna merah diganti dan disesuaikan selera.



Back To Menu


Install

  1. Layout >> Add a Gadget >> HTML/Javascript

    Gambar Add Gadget HTML/Javascript
  2. Masukkan seluruh kode.

    Contoh Kode Gadget Slide Show Tulisan
  3. Save



Back To Menu



Last update 2012-11-20

3 comments:


  1. kok gak bisa bro..???

  2. sudah diganti bro, silahkan dicoba... :D

  3. trims share nya...

Posting Komentar


Creative Commons License
Gadget Slide Show Tulisan by Nano Yulianto is licensed under a Creative Commons Attribution 3.0 Unported License.
Based on a work at http://nanoyulianto.blogspot.com/2010/07/slide-show-tulisan.html.
Permissions beyond the scope of this license may be available at http://nanoyulianto.blogspot.com/.