panjang amat judulnya, ya memang panjanglah kan disini mengungkapkan sebuah pembelajaran yang telah di rangkum menjadi satu.
kode ini saya temukan dengan menggabungkan semuanya yang ada pada
link dua target, tooltip, dan pop up window.
5 langkah yang merupakan di butuhkan untuk membuat sebuah link yang mempunyai dua target untuk membuka jendela sebut saja
Pop UpCari lagi dengan
Query: Pop Up si eneng, bukan hanya itu saja kita juga bisa menampilkan sebuah
ToolTipCari lagi dengan
Query: ToolTip yang
sexy nan cantik, hehehe.
tanpa basa-basi langsung saja ke TKP. ok
setep by step :1. bawa browser kamu ke tempat edit HTML, bagi yang masih lom tahu, tanya aja yang lain, hahahaha.
copy script pop up dibawah dan letakkan tepat di bawah dubur
<head><SCRIPT language='JavaScript1.2'>
function openwindow()
{
window.open("http://blogads2.blogspot.com",
"mywindow","location=1,statusbar=yes,menubar=yes,resizable=yes,toolbar=yes,scrollbars=yes,width=605,height=255,left = 276,top = 307");
}
</SCRIPT> |
| Nama Tag | keterangan |
| blogads2 | ganti dengan nama blog kamu, yang merupakan blog anda yang akan muncul nantinya pada pop up window, jangan sampe di ganti dengan nama papa mama kamu ok, hikshiks. |
statusbar, menubar, resizeable, toolbar, scrollbars.
| bisa anda edit sendiri dengan mengetikkan yes atau no, apabila yes: fitur tersebut akan di tampilkan, sedangkan no: tidak ditampilkan. |
| width=605 | lebar jendela baru dari sebuah pop up yang akan muncul nantinya, bisa kamu atur sendiri dengan sesuka hatimu, pokoknya jangan egois aja sama si eneng yang sedang pake pop up ini, hihi. |
| height=255 | sama dengan yang atas pada width, males aku neranginnya, hehehe. |
| left = 276 | merupakan jarak pop up pada browser kamu mulai dari kiri. |
| top = 307 | jarak pop up pada browser kamu mulai dari atas. |
2. jangan kemana-mana kalau tidak mau tempat duduk anda di tempati orang lain, hehehe. maksud saya diam di tempat edit HTML dan cari kode
]]></b:skin> setelah itu copy kode Css dibawah dan letakkan tepat diatas kode
]]></b:skin> kode Css dibawah merupakan kode dari tampilan Tooltip tersebut.
/*---------- bubble tooltip blogging-goblog.blogspot.com-----------*/
a.tt{
position:relative;
z-index:24;
color:#cc0000;
font-weight:bold;
text-decoration:none;
}
a.tt span{ display: none; }
/*background:; ie hack, something must be changed in a for ie to execute it*/
a.tt:hover{ z-index:25; color: #cc0000; background:;}
a.tt:hover span.tooltip{
display:block;
position:absolute;
top:0px; left:0;
padding: 15px 0 0 0;
width:200px;
color: #993300;
text-align: center;
filter: alpha(opacity:90);
KHTMLOpacity: 0.90;
MozOpacity: 0.90;
opacity: 0.90;
}
a.tt:hover span.top{
display: block;
padding: 30px 8px 0;
background: url(http://4.bp.blogspot.com/_camK6MacbVQ/SmNbRIxiTxI/AAAAAAAAAOc/zjNMwrdyd80/s320/bubble-712378.gif) no-repeat top;
}
a.tt:hover span.middle{ /* different middle bg for stretch */
display: block;
padding: 0 8px;
background: url(http://1.bp.blogspot.com/_camK6MacbVQ/SmNbQ-VEh2I/AAAAAAAAAOU/qiVSMin-U6k/s320/bubble_filler-711451.gif) repeat bottom;
}
a.tt:hover span.bottom{
display: block;
padding:3px 8px 10px;
color: #548912;
background: url(http://4.bp.blogspot.com/_camK6MacbVQ/SmNbRIxiTxI/AAAAAAAAAOc/zjNMwrdyd80/s320/bubble-712378.gif) no-repeat bottom;
} |
kali ini aku males memberi keterangan, dan jika ada pertanyaan beri aja komentar jika kurang jelas, ntar semoga saja saya bisa jawab.
3. SIMPAN TEMPLATE / SAVE TEMPLATE
4. inilah kode link yang harus anda pakai, agar Script Pop Up si eneng dan Tooltip bisa bekerja dengan maksimal, dengan begitu service yang diberikan bisa memuaskan untuk anda, (motto: anda puas kami senang, hahaha).
| <a class="tt" href="javascript:%20openwindow()" onclick="window.location.replace('http://funnyfunniest.blogspot.com/search/label/Humor%20photos')">Nama sebuah link<span class="tooltip"><span class="top"></span><span class="middle">keterangan pada link anda (terserah anda, bukan terserah saya, hihihi)</span><span class="bottom"></span></span></a> |
yang berwarna
merah ganti dengan nama URL anda (Url ini merupakan bukan sebuah pop up)
yang berwarna
biru : merupakan keterang pada link yang anda taruh pada warna
merah.
yang berwarna
hijau : anchor text link atau nama link yang anda buat dari warna
merah.
5. lihat hasilnya apa anda puas atau tidak.
Example Contoh Click here-nya di bawah sini
Nama sebuah linkketerangan pada link anda (terserah anda, bukan terserah saya, hihihi)Nb: Url pada script pop up di atas no.1 hanya bisa di tampilkan hanya satu Url, sedangkan Url yang ada pada no.4 berwarna
merah bisa anda ganti-ganti sesuai selera anda.
besok akan saya posting lanjutan dari
postingan ini.
jika ada kekurangan atau ada yang perlu di tanyakan komen saja, ntar saya akan bantu.
