posisi fixed di Internet Explorer
Hari ini begitu melelahkan hanya untuk mencari solusi bagaimana caranya menampilkan menu yang seolah-olah melayang mengikuti pergerakan dari scroll, jadi menu seolah-olah berada ditempat.
Mungkin diantara kita berfikir itu aja kok repot, dengan menggunakan style css yaitu position:fixed, sudah dapat menyelesaikan permasalahan, namun ternyata tidak semudah itu, ketika dicoba menggunakan browser Internet Explorer, style tersebut tidak memberi efek seperti yang diharapkan. Setelah sy tes langsung ternyata style ini hanya berlaku di firefox n opera --walau yang sy tes cuman 3 browser firefox, ie n safari--.
hampir 3 jam sy konsultasi ke mbah google, untuk menyelesaikan permasalahan ini, mbah google cuman kasih petuah kunjungin web ini n web itu, untung kesabaran masih tetap ada klo ngk konsultasinya dilanjutin besok aja lagi.
tak terasa sudah jam setengah dua belas malam, akhirnya solusi yang diharapkan ketemu juga, mungkin karena mbah google dah kecapean jadi ngk konsen lagi..he..he
akhirnya saya keingat ama eyang yahoo, untung dia masih fresh, sy langsung nanya n... akhirnya n alhamdulillah langsung di beri petuah yang cukup jitu, n hasilnya seperti ini:
Mungkin diantara kita berfikir itu aja kok repot, dengan menggunakan style css yaitu position:fixed, sudah dapat menyelesaikan permasalahan, namun ternyata tidak semudah itu, ketika dicoba menggunakan browser Internet Explorer, style tersebut tidak memberi efek seperti yang diharapkan. Setelah sy tes langsung ternyata style ini hanya berlaku di firefox n opera --walau yang sy tes cuman 3 browser firefox, ie n safari--.
hampir 3 jam sy konsultasi ke mbah google, untuk menyelesaikan permasalahan ini, mbah google cuman kasih petuah kunjungin web ini n web itu, untung kesabaran masih tetap ada klo ngk konsultasinya dilanjutin besok aja lagi.
tak terasa sudah jam setengah dua belas malam, akhirnya solusi yang diharapkan ketemu juga, mungkin karena mbah google dah kecapean jadi ngk konsen lagi..he..he
akhirnya saya keingat ama eyang yahoo, untung dia masih fresh, sy langsung nanya n... akhirnya n alhamdulillah langsung di beri petuah yang cukup jitu, n hasilnya seperti ini:
<style type="text/css">
#fixme {
/* Netscape 4, IE 4.x-5.0/Win and other lesser browsers will use this */
position: absolute; right: 20px; bottom: 10px;
}
body > div#fixme {
/* used by Opera 5+, Netscape6+/Mozilla, Konqueror, Safari, OmniWeb 4.5+, iCab, ICEbrowser */
position: fixed;
}
</style>
<!--[if gte IE 5.5]>
<![if lt IE 7]>
<style type="text/css">
div#fixme {
/* IE5.5+/Win - this is more specific than the IE 5.0 version */
right: auto; bottom: auto;
left: expression( ( -20 - fixme.offsetWidth + ( document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth ) + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
top: expression( ( -10 - fixme.offsetHeight + ( document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
}
</style>
<![endif]>
sedikit penjelasan mengenai sourcode tersebut:
body> div#fixme
sourcode css ini menggunakan selector id yaitu "fixme" jadi untuk menggunakannya pastikan menggunakan #fixme
sebagai contoh <div id="fixme">, <p id="fixme">, namah pada bagina
body> div#fixme -- bahwa #fixme akan digunakan oleh div, jika
anda menggunakan selain div pastikan anda merubah body> div#fixme
menjadi body> p#fixme atau yang lain.
Ok, klo dah pertanyaan jangan sungkan2 konsultasi ke mbah google
n jangan lupa eyang yahoo juga..he..
<![endif]-->Pengirim: arif
wenk says...
02 April 2010
wah saya coba ya mas...thanks
website:www.belumada.com
Tambah Komentar