Wednesday, January 25, 2012

Otomatis Menambahkan Ikon pada Semua Link Eksternal dengan jQuery

Tambahkan ikon di samping semua link eksternal di dalam area <div class='post'></div> secara otomatis:

// Saring semua link eksternal.
// Jika hasilnya cocok, sisipkan gambar eksternal-links.png di sampingnya
$(function() {
    $('div.post a').filter(function() {
        return this.hostname && this.hostname !== location.hostname;
    }).after(' <img class="netral" src="external-links.png" alt="external link" />');
});

External Link Icon external-links.png

Lihat Demo


Sumber: Learning jQuery - Dynamically Add an Icon for External Links

Labels: ,

3 Comments:

At Thursday, January 26, 2012 at 2:35:00 PM GMT+7, Blogger Sinto said...

Baru kemarin Aku mikirin tentang Tips ini eh udah di post disini

 
At Friday, January 27, 2012 at 8:19:00 AM GMT+7, Blogger Taufik Nurrohman said...

@system of blog: Tapi situs Blogger agak susah menerapkan ini, Soalnya banyak elemen-elemen Blogger yang juga merupakan elemen eksternal. Misalnya, foto-foto yang ada di posting disimpan di direktori Picasa, bukan di direktori blogmu sendiri. Kalau kode ini diterapkan, semua gambar dan link demo eksternal juga akan menerima ikon T_T

 
At Friday, January 27, 2012 at 3:37:00 PM GMT+7, Blogger Sinto said...

Wah kalau Gitu repot juga, di SET aja cuman buat link Bisa gak tuh

 

Post a Comment

<< Home