Home » » Tutorial Membuat Link Berkedip

Tutorial Membuat Link Berkedip

Written By Unknown on Tuesday, February 5, 2013 | 10:56 AM

membuat link berkedip
Tips and Trick- Dalam posting kali ini Tips and Trik akan berbagi cara membuat link berkedip.Tujuan dari lunk berkedip ini adalah untuk memberitahu pembaca konten blog,agar tahu bahwa ada link penting dalam konten.Karna secara tidak sengaja pengunjung akan melihat link tersebut.

Yup,tanpa banyak basa-basi lagi,meskipun memang agak basi,hehehehe...langsung saja ke TKP

Membuat Link Kedap-Kedip.

  • Copas Script di Bawah ini:


var flashinglinks={

pause: 1000,
targetlinks:[],

changecolor:function(){
    for (var i=0; i<this.targetlinks.length; i++){
        var targetlink=this.targetlinks[i]
        var cssprop=(targetlink.colorsetting.type=="flashfg")? "color" : "backgroundColor"
        targetlink.style[cssprop]=(targetlink.style[cssprop]!=targetlink.colorsetting.ncolor)? targetlink.colorsetting.ncolor : targetlink.colorsetting.ocolor
        targetlink.colorsetting.ccolor=targetlink.style[cssprop]
    }
},

fetchcssvalue:function(el, prop){
    return (el.style[prop])? el.style[prop] : (el.currentStyle)? el.currentStyle[prop] : (document.defaultView.getComputedStyle)? document.defaultView.getComputedStyle(el, "").getPropertyValue(prop) : ""
},


addEvent:function(targetarr, functionref, tasktype){
    if (targetarr.length>0){
        var target=targetarr.shift()
        if (target.addEventListener)
            target.addEventListener(tasktype, functionref, false)
        else if (target.attachEvent)
            target.attachEvent('on'+tasktype, function(){return functionref.call(target, window.event)})
        this.addEvent(targetarr, functionref, tasktype)
    }
},

init:function(){
    var alllinks=document.getElementsByTagName("a")
    for (var i=0; i<alllinks.length; i++){
        if (alllinks[i].getAttribute('rel') && /(flash[bf]g)\[(.+)\]/i.test(alllinks[i].getAttribute('rel'))){
            alllinks[i].colorsetting={
                ocolor: this.fetchcssvalue(alllinks[i], RegExp.$1=="flashfg"? "color" : "backgroundColor"),
                ncolor: RegExp.$2,
                type: RegExp.$1
            }
            this.targetlinks.push(alllinks[i])
        }
    }
    if (this.targetlinks.length>0){
        setInterval(function(){flashinglinks.changecolor()}, this.pause)
    }
}

}

flashinglinks.addEvent([window], function(){flashinglinks.init()}, "load")
  • Login ke blogger dengan ID Anda, setelah berada pada halaman dashboard blogger, pilih menu Template>> Edit HTML >> Proceed
  • Cari kode </head> pada dokumen HTML template Anda dan tempatkan URL script yang didapatkan dari tempat hosting script tepat di atas kode </head>.  Contoh URL script yang ditempatkan di atas kode </head> seperti berikut ini.
    <script src='http://rizkyrf.googlecode.com/files/flashinglinks.js' type='text/javascript'/>
  • Tekan tombol Save template untuk menyimpan perubahan dokumen HTM template Anda.
  • Selanjutnya setiap link penting yang akan dibuat blinking/berkedip tambahkan elemen berikut ini, pada kode HTML link, dan jangan lupa ganti "colorvalue" dengan kode warna.
    <a href="contoh.htm" rel="flashfg[colorvalue]">Contoh 1</a>
    <a href="contoh.htm" rel="flashbg[colorvalue]">Contoh 2</a>
  • Sehingga secara lengkap kode HTML link (seperti demo di atas) terlihat seperti berikut,
    <a href="http://rizkyrf.blogspot.com/" rel="flashfg[red]" target="_blank">Tips and Trick </a>
    <a href="http://rizkyrf.blogspot.com/" rel="flashbg[yellow]" target="_blank">Tips and Trick </a>
    Banyak cara kita untuk mempercantik blig dan menarik pengunjung.
     Semoga artikel ini bermanfaat


2 comments:

Like us on Facebook
Follow us on Twitter
Recommend us on Google Plus
Subscribe me on RSS