Tampilkan postingan dengan label 4 Web. Tampilkan semua postingan
Tampilkan postingan dengan label 4 Web. Tampilkan semua postingan
22 Desember 2009
Download Kumpulan Animated Gif Emoticon Lucu
.
22 Desember 2009
2
comments
02 Desember 2009
Memahami perbedaan ukuran CSS (px,em,%,pt)
.
02 Desember 2009
3
comments
supaya anda tidak lagi silahkan kunjungi http://pxtoem.com, web ini menyediakan 3 menu utama yaitu convert (merubah ukuran dari px,ems,% dan pt), Get CSS (untuk melihat hasil css yang digenerate) dan learn (untuk lebih memahami satuan-satuan di atas)
Berikut ini kutipan cara perhitungan dari menu learn :
Note:16px is used as the body text size in all conversions because that is the browser default on today’s browser. You will change 16px to your base text size.
- PX to EM: text size in pixels / body text size in pixels = size in EMs
- Example: 12px / 16px = .75em
- PX to %: text size in pixels / body text size in pixels * 100 = size in %
- Example: 12px / 16px * 100 = 75%
- PX to PT: text size in pixels * points per inch / pixels per inch = size in pt
- Example: 16px * 72 (72 points = 1 inch) / 96 (96 pixels per inch in Windows, 72 in Mac) = 12pt
- EM to PX: text size in EMs * body text size in pixels = size in pixels
- Example: .75em * 16px = 12px
- EM to %: text size in EMs * 100 = size in %
- Example: .75em * 100 = 75%
- % to PX: text size in % * body text size in pixels / 100 = size in pixels
- Example: 75 * 16px / 100 = 12px
- % to EM: text size in % / 100 = size in EMs
- Example: 75 / 100 = .75em
- PT to PX: text size in pt * pixels per inch / points per
03 Maret 2009
Menu dropdown dengan J-Query
.
03 Maret 2009
0
comments
Akhir akhir ini Pemrograman Javascript untuk web semakin melejit karena memberikan hasil yang lebih sempurna dan dinamis. JQuery merupakan salah satu javasript framework yang sering digunakan oleh para web programmer. Misalnya untuk membuat menu sbb :
Menu diatas bukan buatan saya. tapi saya download dari blog seseorang … tapi siapa ya.. lupa linknya.Mudah-mudah orangnya gak keberatan karyanya aku share.
yang mau ikutan nyoba download aja disini, dan jangan lupa ucapkan terimaksih buat mas/mbak yang sudah membuatnya…
01 Maret 2009
Membuat Menu Navigasi Interaktif dengan CSS
.
01 Maret 2009
6
comments
Saat browsing di internet seringkali kita jumpai menu navigasi yang berubah tampilannya saat dihampiri mouse atau setelah diklik. untuk membuat menu navigasi tersebut ternyata tidaklah susah, hanya dengan beberapa baris kode css kita dapat mengatur mau seperti apa menu navigasi web atau blog kita.
style dari menu di atas adalah sebagai berikut :
<style type="text/css">
#menu_ku{
position:relative;
display:block;
height:26px;
font-size:11px;
font-weight:bold;
background:transparent url(gambar/bgOFF.gif) repeat-x top left;
font-family:Arial,Verdana,Helvitica,sans-serif;
border-bottom:3px solid #FF0066;
}
#menu_ku ul{
margin:0px;
padding:0;
list-style-type:none;
width:auto;
}#menu_ku ul li{
display:block;
float:left;
margin:0;
}#menu_ku ul li a{
display:block;
float:left;
color:#FFFFFF;
text-decoration:none;
padding:7px 20px 0 20px;
height:19px;
background:transparent url(ganbar/bgDIVIDER.gif) no-repeat top right;
}
#menu_ku ul li a:hover,#menu_ku ul li a.current{
color:#FFFFFF;
background:#0e1fa4 url(gambar/bgDIVIDER.gif) no-repeat top right;
}
</style>
tag style di atas diletakkan di dalam tag head :
<head>
<style type="text/css">
……………………………
</style></head>
dari tag style di atas terdapat definisi pengaturan menu default yaitu id menu_ku (#menu_ku) sbb :
- ditampilkan mode blok dengan tinggi 26 pixel, ukuran huruf 11 pixel,jenis huruf Arial,Verdana,Helvitica,sans-serif, huruf tebal.
- background “url(gambar/bgOFF.gif) repeat-x top left” yang berarti background beralamat pada folder gambar dengan nama file bgOFF.gif yang berulang secara mendatar (searah sumbu x). Anda dapat menggantinya dengan alamat gambar yang anda upload sendiri.
- garis warna pink diatur dengan border-bottom:3px solid #FF0066;
pengaturan style untuk menu saat dilewati mouse (hover) dan saat menu dipilih pada intinya terletak pada #menu_ku ul li a:hover,#menu_ku ul li a.current
- saat menu dilewati mouse dan terseleksi, background warna biru tua (:#0e1fa4) dan warna font putih.
- background url(gambar/bgDIVIDER.gif) no-repeat top right; bearati background gambar hanya akan muncul pada bagian kanan blok menu tanpa berulang, hal ini dimaksudkan untuk memberikan batas anatara setiap menu.
untuk menampilkan menu, saya gunakan scrip berikut yang diletakan di dalam tag body :
a class='current' digunakan untuk memberi tampilan menu yang terpilih. Sudah selesai, dan anda tinggal menyesuaikan kode diatas sesuai dengan tampilan dan menu yang anda inginkan. menu yang sudah jadi dapat anda download di SINI<div id='menu_ku'>
<ul>
<li><a class='current' href='http://www.kompiku.com'>menu 1</a></li>
<li><a href='http://www.kompiku.com'>menu 2</a></li>
<li><a href='http://www.kompiku.com'>menu 3</a></li>
<li><a href='http://www.kompiku.com'>menu 4</a></li>
<li><a href='http://www.kompiku.com'>menu 5</a></li>
</ul>
</div>
28 Januari 2009
Download E-Book dan JQuery Development Bundle
.
28 Januari 2009
0
comments
Anda dapat menyesuaikan sendiri paket yang akan anda download atau dapat memilih dari berbagai theme yang disediakan sepert gambar berikut :
jika anda membutuhkan e-booknya silahkan download E-Book JQuery di sini, Ebook ini dilengkapi dengan contoh pemrogramannya.
20 Desember 2008
50 Set Koleksi Ikon Cantik Gratis
.
20 Desember 2008
5
comments
Bagi anada yang sedang mencari ikon-ikon catik untuk mempercantik blog anda mungkin akan lebih baik jika anda mengunjungi Noupe.com. berbagai jenis ikon dengan berbagai macam gaya terdapat di sini. Anda pun dapat mengambilnya gratis karena memang dibagikan gratis oleh yang membuatnya, berikut ini beberpa cuplikan koleksi ikon tersebut :
I-Phone Icon :
Socialize Icon
Coquette Icon
Glossy Blogger Icon
Web Brosser Icon
dan masih banyak koleksi ikon lainnya, silahkan kunjungi noupe.com untuk mendownloadnya
Langganan:
Postingan (Atom)
