Hari Mulya

Your Left Brain Can Analyze It While Your Right Brain Let You Feel It

Blogging How It Works 

Draw On It

Hari Mulya 31 Comments , , ,

Gambar atau image ternyata tak cuma bisa diberi 1 link, tapi bisa lebih dari satu link. Bahkan sebagai bonusnya kita bisa membuat link dengan bentuk kotak, lingkaran, ataupun berbentuk poligonaL. MisaLnya saja gambar di bawah ini, gambar tersebut berukuran 450 x 450 pixeL, sengaja saya beri tambahan beberapa bentuk dua dimensi untuk memudahkan sahabat menemukan link yang saya buat.

Penambahan link pada gambar dengan cara seperti ini memang agak rumit dan membutuhkan sedikit perhitungan. Saat menambahkan gambar pada haLaman bLog, kita tinggaL menambahkan code berikut:

<img src="gambar.jpg" alt="ini gambar" width="450" height="450" border="0" usemap="#linkbanyak"/>
<map name="linkbanyak">
<area shape="rect" coords="35,50,185,150" href="#linkdisini" alt="kotak" />
<area shape="poly" coords="200,166,312,154,272,254,255,234,175,297,139,254,216,190" href="#linkdisini" alt="panah" />
<area shape="circle" coords="350,350,50" href="#linkdisini" alt="lingkaran" />
</map>

shape: adaLah bentuk link yang akan digunakan sebagai link, bisa berupa kotak (rect), lingkaran (circLe) atau poligonaL (poLy). Sedangkan isi dari tag coords daLam satuan pixeL pada masing-masing shape itu kira-kira seperti ini:

rect : coords="x1,y1,x2,y2", dimana x1,y1 adaLah koordinat titik pojok kiri atas dan x2,y2 adaLah koordinat titik pojok kanan bawah.

circle : coords="x1,y1,x2,y2,x3,y3,…,xn,yn", dimana x1,y1 adaLah koordinat titik awaL shape dan xn,yn adaLah koordinat titik akhir shape.

poly : coords="x1,y1,r", dimana x1,y1 adaLah koordinat titik tengah lingkaran dan r adaLah panjang jari-jari lingkaran.

Draw On It

kotak panah lingkaran

31 thoughts on “Draw On It”

  • marsudiyanto
    15 March 2010 at 11:59
    Permalink

    Sangat cocok untuk link pada peta atau hal lain yang butuh keterangan mendetail…

    Tapi…
    Hmmmmmmmmmmm……..

    kok ‘hhmmm’ Pak?
    bukankah iLmu matematika bisa digunakan di sini?

    .-= marsudiyanto´s last blog : Blog On The Blog Ver 1.0 =-.

    Reply
  • Muji
    15 March 2010 at 13:51
    Permalink

    Mbok ojo nganggo itung2an!

    kaLo pake tool/software ga usah pake itung2an, Dab..
    tinggaL digambar di atas image…

    *nek nganggo itung2an, kowe ora nyandak…

    Reply
  • Rita Susanti
    15 March 2010 at 13:54
    Permalink

    Wuiiih keren hasilnya…Tapi tetep ora ngartos aku…

    pantesan ga ngartos, lha wong ngidamnya lalapan… 😀

    .-= Rita Susanti´s last blog : NgiDaM… =-.

    Reply
    • Rita Susanti
      15 March 2010 at 14:50
      Permalink

      Hmmm juga…
      masih mending atuh om ngidam lalapan, daripada ngidam html, kan kasian yg nyari ntar gak bakal dapat, dan gak bisa dimakan pula 😀

      ga bisa dimakan tapi bisa bikin kenyang lho, mBa..
      tanya aja Pak Mars… 😀

      .-= Rita Susanti´s last blog : NgiDaM… =-.

      Reply
  • kyaine
    15 March 2010 at 14:20
    Permalink

    apa karena saya suka lalapan juga ya? sama seperti Rita, tetep ora ngartos 🙂

    mungkin karena saya juga memakai kaLimat-kaLimat ajaib yang susah dimengerti… 😀

    Reply
  • bundadontworry
    15 March 2010 at 14:45
    Permalink

    bunda sukses besar , gak ngerti sama sekali, ya sudah menyimak saja dgn tertib sambil melongo he he
    salam

    seLamat Bunda.. semoga sukses seLalu… 😀

    .-= bundadontworry´s last blog : Tanda Tanda Sombong =-.

    Reply
  • fanz
    16 March 2010 at 10:26
    Permalink

    keren! give me more tutz 🙂

    more..more..more… 😀

    .-= fanz´s last blog : Jilbab =-.

    Reply
  • hanif IM
    16 March 2010 at 22:05
    Permalink

    bentar2, terus bagaimana jika membuat banner 125×125? dengan banyak link di dalamnya? hehe, ntar gak muat. hohoho.

    lagian siapa juga yang mau pasang banyak link di gambar yang sekeciL itu? 😆

    Reply
  • aldy
    16 March 2010 at 22:37
    Permalink

    softwarenya pake apa bro biar nggak mumet ngitungnya ?

    Reply

Leave a Reply