Jul 30, 2009

Membuat link ke lokasi di dalam halaman yang sama

Membuat link ke lokasi di dalam halaman yang sama ? Mungkin bisa lebih dimengerti bila langsung kita lihat hasilnya. Klik link pergi ke contoh anchor ini.

Disini ada dua proses, yaitu membuat hyperlink dan memberi nama anchor. Kita mulai dengan memberi nama anchor pada tempat tujuannya:

<h2><a name="contoh1">ini contoh anchor</a></h2>

Diatas kita beri nama heading ini contoh anchor dengan nama contoh1

Kemudian membuat hyperlink yang menuju ke anchor contoh1 sama dengan membuat hyperlink biasa. Anda cukup menambahkan tanda # didepan nama anchor yang dituju

<A HREF="#contoh1">pergi ke contoh anchor </A>
.

Bagaimana kalau kita ingin pergi ke anchor di halaman yang lain? Cukup ikuti contoh dibawah:

<A HREF="http://sexyclimate.blogspot.com/2009/07/membuat-image-map.html#contoh2">pergi ke contoh anchor di halaman lain </A>

Ini adalah hasil link diatas : pergi ke contoh anchor di halaman lain

ini contoh anchor

Membuat image map

Image map adalah cara membuat sebuah image/ gambar menjadi beberapa link sekaligus. Lebih mudahnya kita lihat gambar dari posting Street Fighter IV yang akan kita jadikan sebagai bahan praktek.

Ide dasarnya adalah membuat setiap foto karakter street fighter IV diatas menjadi link ke halaman masing-masing. Kita bisa melakukannya dengan cara yang mudah atau cara yang rumit hehe..

Cara yang mudah: Potong-potong gambar diatas lalu susun dan masukkan dalam tabel, baru masing-masing potongan gambar dikasih link. Mudah tho, enak tho, whahaha..

Trus kenapa mesti melakukan dengan cara yang rumit? Kenapa mesti membuat image map? Pertimbangkan hal berikut:

  • Semakin banyak gambar yang diloading berarti semakin banyak HTTP Request (semakin lambat pula loading halaman kita), dan gambar diatas mesti dipotong menjadi puluhan gambar, artinya puluhan HTTP Request bisa kita hemat bila kita lakukan image mapping.
  • Setiap gambar memiliki tabel warna dalam file-nya, puluhan potongan gambar akan memerlukan puluhan tabel warna yang berulang padahal dengan 1 gambar maka ukuran file bisa diperkecil karena cuma memakai 1 tabel warna, atau paling tidak bisa sama besarnya dengan gabungan seluruh potongan gambar tersebut.
  • Ilmu kita bertambah, ini yang paling penting ;)

Sekarang kita buat kode HTML yang diperlukan

<div align="center"> <img style="width: 390px; height: 595px;" usemap="#mapFighter" alt="Select your street fighter" src="street-fighter-4-select.jpg"> </div>

Tag <div> kita gunakan untuk membungkus kode agar gambar berada ditengah, sementara pada tag <img /> kita melihat usemap="#mapFighter" yang merupakan nama map yang akan kita buat

Sekarang mari kita buat image map -nya yang akan diberi nama mapFighter seperti yang kita lihat pada kode dibawah:

<div align="center"> <map name="mapFighter"> </map> <img style="width: 390px; height: 595px;" usemap="#mapFighter" alt="Select your street fighter" src="street-fighter-4-select.jpg"> </div>

Dalam image map ini kita akan membuat area berbentuk persegi panjang. Perhatikan kode berikut:

<div align="center"> <map name="mapFighter"> <area href="http://sexyclimate.blogspot.com/2009/05/fei-long.html" alt="fei-long" title="fei-long" shape="RECT" coords="0,0,100,80"> </map> <img style="width: 390px; height: 595px;" usemap="#mapFighter" alt="Select your street fighter" src="street-fighter-4-select.jpg"> </div>

Kode yang mesti kita perhatikan adalah shape="RECT" coords="0,0,100,80", menandakan persegi panjang (RECT) dengan ukuran piksel-nya = horisontal 100 dan vertikal 80 ; dihitung dari sudut kiri atas gambar (0,0) sehingga didapat coords="0,0,100,80"

Bagaimana menentukan koodinat gambar yang ditengah? Misalkan gambar kang mas Guile.

<div align="center"> <map name="mapFighter"> <area href="http://sexyclimate.blogspot.com/2009/05/fei-long.html" alt="fei-long" title="fei-long" shape="RECT" coords="0,0,100,80"> <area href="http://sexyclimate.blogspot.com/2009/05/guile.html" alt="Guile" title="Guile" shape="RECT" coords="200,160,300,240"> </map> <img style="width: 390px; height: 595px;" usemap="#mapFighter" alt="Select your street fighter" src="street-fighter-4-select.jpg"> </div>

ukuran persegi panjang kita tetap 100 x 80 pixel tetapi dengan titik awal yang berbeda, disini sudut kiri atas persegi panjang kita adalah titik 200px,160px sehingga sudut kanan bawahnya menjadi (200px+100px=300px),(160px+80px=240px). Kita dapatkan angka coords="200,160,300,240"

Berikut kode html lengkapnya:

<div align="center"> <map name="mapFighter"> <area href="http://sexyclimate.blogspot.com/2009/05/fei-long.html" alt="fei-long" title="fei-long" shape="RECT" coords="0,0,100,80"> <area href="http://sexyclimate.blogspot.com/2009/05/cammy.html" alt="Cammy" title="Cammy" shape="RECT" coords="100,0,200,80"> <area href="http://sexyclimate.blogspot.com/2009/05/akuma.html" alt="Akuma" title="Akuma" shape="RECT" coords="200,0,300,80"> <area href="http://sexyclimate.blogspot.com/2009/06/gouken.html" alt="Gouken" title="Gouken" shape="RECT" coords="300,0,400,80"> <area href="http://sexyclimate.blogspot.com/2009/05/dhalsim.html" alt="Dhalsim" title="Dhalsim" shape="RECT" coords="0,80,100,160"> <area href="http://sexyclimate.blogspot.com/2009/05/blanka.html" alt="Blanka" title="Blanka" shape="RECT" coords="100,80,200,160"> <area href="http://sexyclimate.blogspot.com/2009/05/chun-li.html" alt="Chun-Li" title="Chun-Li" shape="RECT" coords="200,80,300,160"> <area href="http://sexyclimate.blogspot.com/2009/05/ryu.html" alt="Ryu" title="Ryu" shape="RECT" coords="300,80,400,160"> <area href="http://sexyclimate.blogspot.com/2009/05/edmund-honda.html" alt="Edmund Honda" title="Edmund Honda" shape="RECT" coords="0,160,100,240"> <area href="http://sexyclimate.blogspot.com/2009/05/zangief.html" alt="Zangief" title="Zangief" shape="RECT" coords="100,160,200,240"> <area href="http://sexyclimate.blogspot.com/2009/05/guile.html" alt="Guile" title="Guile" shape="RECT" coords="200,160,300,240"> <area href="http://sexyclimate.blogspot.com/2009/05/ken-masters.html" alt="Ken Master" title="Ken Master" shape="RECT" coords="300,160,400,240"> <area href="http://sexyclimate.blogspot.com/2009/06/seth.html" alt="Seth" title="Seth" shape="RECT" coords="0,240,400,320"> <area href="http://sexyclimate.blogspot.com/2009/05/m-bison.html" alt="M. Bison" title="M. Bison" shape="RECT" coords="0,320,100,400"> <area href="http://sexyclimate.blogspot.com/2009/05/sagat.html" alt="Sagat" title="Sagat" shape="RECT" coords="100,320,200,400"> <area href="http://sexyclimate.blogspot.com/2009/05/vega.html" alt="Vega" title="Vega" shape="RECT" coords="200,320,300,400"> <area href="http://sexyclimate.blogspot.com/2009/05/balrog.html" alt="Balrog" title="Balrog" shape="RECT" coords="300,320,400,400"> <area href="http://sexyclimate.blogspot.com/2009/05/abel.html" alt="Abel" title="Abel" shape="RECT" coords="0,400,100,480"> <area href="http://sexyclimate.blogspot.com/2009/05/crimson-viper.html" alt="Crimson Viper" title="Crimson Viper" shape="RECT" coords="100,400,200,480"> <area href="http://sexyclimate.blogspot.com/2009/05/rufus.html" alt="Rufus" title="Rufus" shape="RECT" coords="200,400,300,480"> <area href="http://sexyclimate.blogspot.com/2009/05/el-fuerte.html" alt="El-Fuerte" title="El-Fuerte" shape="RECT" coords="300,400,400,480"> <area href="http://sexyclimate.blogspot.com/2009/06/sakura.html" alt="Sakura" title="Sakura" shape="RECT" coords="0,480,100,560"> <area href="http://sexyclimate.blogspot.com/2009/06/rose.html" alt="Rose" title="Rose" shape="RECT" coords="100,480,200,560"> <area href="http://sexyclimate.blogspot.com/2009/05/dan-hibiki.html" alt="Dan Hibiki" title="Dan Hibiki" shape="RECT" coords="200,480,300,560"> <area href="http://sexyclimate.blogspot.com/2009/05/gen.html" alt="Gen" title="Gen" shape="RECT" coords="300,480,400,560"> </map> <img style="width: 390px; height: 595px;" usemap="#mapFighter" alt="Select your street fighter" src="street-fighter-4-select.jpg"> </div>

Silahkan kunjungi Street Fighter IV untuk melihat hasil yang sudah jadi

Membuat sebuah link yang membuka dalam halaman yang baru

Ini bukan sekedar tips blogger, tapi lebih pada tips html. Membuat sebuah link biasa akan berbentuk seperti ini:
< a href="http://sexyclimate.blogspot.com/"> Tips and Download </a>
Link yang kita klik akan membuat halaman diloading di tempat kita berada. Sering kita menginginkan sebuah link membuka halaman pada tab yang baru agar kita tidak kehilangan halaman kita berada saat ini. Tambahkan kode berikut :
target="_blank"
Kode HTML kita menjadi:
< a href="http://sexyclimate.blogspot.com/" target="_blank"> Tips and Download </a>
Simpel, tapi sering terlupakan. Berikut adalah hasil link yang telah jadi: [ Tips and Download ]
Reblog this post [with Zemanta]

Jul 29, 2009

discussing room

facepack football manager 2009- Indonesian's national teams

Indonesian's national team facepack

These are Indonesian's national team Rar Version or Zip Version for installed in game football manager 2009

If you don't know how to install a facepack, here is how:

first extract the zip or rar file then copy folder with faces to folder "My Documents\Sports Interactive\Football Manager 2009\graphics" (if graphics folder is absent - create it!), then set your Football Manager 2009 Preferences as:

  • Use Skin Cache = Off
  • Always Reload Skin on Confirm = On

The same rule works for Logos, Kits, Skins.

You can make folder inside folder in this graphics folder to sort your facepacks, and you can make as many folder as you need. But always include the config.xml in the same folder

The players face are from Indonesian's national teams those choosed to played in Pre Asian Cup 2011 and Asian Cup 2007

Indonesian's national teams Pre Asian Cup 2011

Name- Birth date- their clubs at those time

Achmad Kurniawan 31/10/1979 Persik Kediri
Markus Harison 14/03/1981 PSMS Medan
Fery Rotinsulu 28/12/1982 Sriwijaya FC
Charis Yulianto (C) 11/07/1978 Sriwijaya FC
Ismed Sofyan 28/08/1979 Persija Jakarta
Maman Abdurrachman 12/05/1982 Persib Bandung
Ricardo Salampessy 18/02/1984 Persipura Jayapura
Erol Iba 06/08/1979 Pelita Jaya
Muhammad Roby 12/09/1985 Persik Kediri
Nova Arianto 04/11/1978 Persib Bandung
Rachmat Latief 27/11/1988 PSM Makassar
Isnan Ali 15/09/1979 Sriwijaya FC
Ponaryo Astaman 25/09/1979 Persija Jakarta
Firman Utina 15/12/1981 Pelita Jaya
Ellie Aiboy 20/04/1979 PSMS Medan
Arif Suyono 03/01/1984 Arema Malang
Pieter Rumaropen 13/11/1983 Persiwa Wamena
Hariono 02/10/1985 Persib Bandung
Boaz Salossa 16/03/1986 Persipura Jayapura
Talaohu Abdul Musafry 19/02/1982 Persiba Balikpapan
Budi Sudarsono 19/09/1979 Sriwijaya FC
Bambang Pamungkas 10/06/1980 Persija Jakarta

Indonesian's national teams Asian Cup 2007

Feri Rotinsulu
Yandri Christian Pitoy
Markus Horison
Firmansyah
Charis Yulianto
Maman Abdurrachman
Ricardo Salampessy
Erol Iba
Muhammad Ridwan
Harry Saputra
Supardi
Atep
Syamsul Chaerudin
Firman Utina
Ponaryo Astaman
Mahyadi Panggabean
Eka Ramdhani
Bambang Pamungkas
Zaenal Arief
Ismed Sofyan
Budi Sudarsono
Rahmat Rivai
Ellie Aiboy

Jul 28, 2009

Membuat blockquote pada blogger

Tag <blockquote> berguna untuk menampilkan kumpulan teks yang kita anggap penting. Saya menemukan pada template minima yang saya pakai hampir tidak ada perbedaan antara teks biasa dan teks pada blockquote. Agar blockquote yang saya pakai terlihat jelas maka seperti biasa saya perlu masuk ke Tata Letak kemudian edit HTML dan dengan menekan tombol control+F saya cari kata kunci blockquote. Saya temukan baris :
.post-body blockquote { line-height:1.3em; }
dengan sedikit melakukan editing pada kode tersebut maka template menjadi seperti pada blockquote dibawah:
.post-body blockquote { background-color: #DCDCDC; border: 1px solid #DCDCDC; color: #A52A2A; font: normal 100% serif; line-height:1.3em; }
hasil yang saya dapatkan bisa anda lihat sendiri pada dua blockquote diatas. Sekedar untuk mengingatkan, cara melakukan blockquote adalah dengan menaruh teks yang anda inginkan didalam tag
<blockquote> Isi text yang anda inginkan. </blockquote>
Apabila anda tidak menemukan sama sekali .post-body blockquote pada template anda, cukup tambahkan baris .post-body blockquote diatas pada template. Caranya, pada firefox cukup tekan bersamaan tombol control dan F lalu ketikkan .post-body maka anda akan menemukan kode xhtml yang mengatur tampilan pada posting. Letakkan blockquote anda disitu.

menambahkan fasilitas search pada blogger

adalah search form untuk memudahkan pengguna menemukan isi pada blog kita.

Masuk pada admin blog anda dan pilih Tata Letak kemudian Elemen Halaman. Tambahkan gadget HTML/JavaScript dan pada bagian isi masukkan kode:

<form id="searchthis" action="/search" style="display:inline;" method="get"> <input color="#fff" font value="Enter search terms" type="text" id="search-box" style="background: #fff; border: 2px solid #555" size="25" name="q"/> <input id="search-btn" value="Search" type="submit"/> </form>

Sekarang bila anda ingin menyesuaikan dengan warna template anda, cukup rubah kodenya, misal:

  • Rubah style="background: #fff; untuk mengganti warna background.
  • Rubah border: 2px solid #555 untuk mengganti warna border kotak pencarian

Silahkan anda mengutak-atik kode diatas agar bisa lebih mengerti lebih dalam cara mengubahnya. Anda dapat melihat tabel warna pada html color.

Membuat quote

Apa yang dimaksud dengan quote? Perhatikan box disamping. Sangat bermanfaat untuk menarik perhatian pada tulisan yang menggunakan quote bukan? Bagaimana cara membuatnya? Berikut adalah kode yang digunakan untuk membuat quote disamping:

<div style="border-top: 1px solid rgb(255, 255, 255); border-bottom: 2px solid rgb(255, 255, 255); padding: 5px; width: 200px; height: 50px; float: right;"> Wek wek wek wek wek wkek .... meong? (isi dengan quote anda) </ >

download

Download Page

fun stuff

mnm

Hai, nice to see you

iklim dan cuaca

Tips dan Tutorial

Tips dan Tutorial

Jul 16, 2009

Mengeringkan handphone yang tercelup air menggunakan beras

Handphone, Blackberry, dan peralatan elektronik portabel lainnya biasanya tidak berfungsi bila basah dan jarang yang benar-benar tahan air. Hal ini dikarenakan beberapa sirkuit mini didalamnya yang terendam air bisa mengalami kerusakan. Tapi kita masih bisa mencoba untuk mengeringkannya dengan harapan bisa menyelamatkan teman kecil kita yang mahal ini.

Dry the Phone

Matikan handphone dan keluarkan baterainya. Gunakan handuk untuk mengeringkan keduanya. Setelah benar-benar kering jangan lupa menggoyang-goyangkan handphone, cukup dengan goyangan ringan saja, agar bisa mengeluarkan air yang masih ada didalam handphone kita.

Hindari mengeringkan dengan alat yang panas

Jangan gunakan hair dryer, oven, atau tungku untuk mengeringkan dalaman handphone kita. Mungkin ada yang berhasil tetapi banyak juga yang malah mengalami masalah tambahan ( plastik handphone nya yang meleleh misalnya). Ingatlah selalu bahwa sirkuit elektronik handphone sangat sensitif terhadap panas.

Mana berasnya ?

Handphone dalam berasTahukah anda bahwa beras bisa menyerap kelembaban yang masih tersisa pada handphone anda? Cukup timbun handphone anda dengan beras semalaman. Keesokan paginya coba hidupkan handphone tersebut. Bila masih belum bisa hidup coba lakukan mandi beras semalam lagi

Memanfaatkan sifat alkohol

Alkohol bisa memaksa air untuk keluar, dan untungnya alkohol mampu menguap dengan cepat, kita bisa menunggu seharian untuk memastikannya sudah mengering

Sad Ending?

Kadang perjuangan kita tidak berakhir dengan happy ending. Jadi bila handphone tersayang kita masih belum bisa hidup, saatnya mengantarkannya ke service handphone yang terpercaya. Tapi bersiaplah akan kemungkinan terburuk

Jujurlah pada teknisi

Saya tidak tahu mengapa anda punya alasan kuat untuk berbohong, tetapi katakan dengan jujur pada teknisi service handphone anda bahwa handphone anda terendam air. Banyak handphone yang punya indikator kecil pada badannya yang akan berubah warna apabila handphone pernah terendam air

perhatikan tanda pada baterai handphone yang pernah terendam ini menjadi memerah, beda handphone berbeda pula letak indikatornya
tanda pada handphone yang pernah terendam

Popular Posts

Recent Posts

puzzle yu-gi-oh!- - Metodologi Penelitian - - Fable - - Download - - Iklim