Contoh Bisa Lihat Langsung Dibawah Ini..!!(Sorry Agak Kacau :v)
Gimana?? jika sobat tertarik mencobanya, silahkan ikuti tahap-tahap berikut :
1. Login Ke Akun Blog Sobat
2. Pilih Rancangan/Tata Letak3. Cari Kode ]]></b:skin> , Lalu Masukan kode Berikut tepat diatasnya.
#list{
margin:0 auto;
height:600px;
width:600px;
overflow:hidden;
position:relative;
background-color:#111;
-moz-box-shadow:0px 10px 20px #000;
}
#list ul,
#list li{
list-style:none;
margin:0;
padding:0;
}
#list a{
position:absolute;
text-decoration:none;
color:#666;
text-shadow:0px 1px 2px #000;
}
#list a:hover{
color:cyan;
}4. Kemudian cari kode </body> dan taruh kode berikut tepat di atasnya.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(document).ready(function(){
var element = $('#list a');;
var offset = 0;
var stepping = 0.03;
var list = $('#list');
var $list = $(list)
$list.mousemove(function(e){
var topOfList = $list.eq(0).offset().top
var listHeight = $list.height()
stepping = (e.clientY - topOfList) / listHeight * 0.2 - 0.1;
});
for (var i = element.length - 1; i >= 0; i--)
{
element[i].elemAngle = i * Math.PI * 2 / element.length;
}
setInterval(render, 20);
function render(){
for (var i = element.length - 1; i >= 0; i--){
var angle = element[i].elemAngle + offset;
x = 120 + Math.sin(angle) * 30;
y = 45 + Math.cos(angle) * 40;
size = Math.round(40 - Math.sin(angle) * 40);
var elementCenter = $(element[i]).width() / 2;
var leftValue = (($list.width()/2) * x / 100 - elementCenter) + "px"
$(element[i]).css("fontSize", size + "pt");
$(element[i]).css("opacity",size/100);
$(element[i]).css("zIndex" ,size);
$(element[i]).css("left" ,leftValue);
$(element[i]).css("top", y + "%");
}
offset += stepping;
}
});
</script>KET::
Jika Sobat Sudah memasang script yg berwarna hijau diatas, mka, kode diatas tidak perlu lagi (biar gak double).
5. Dan untuk pemanggilan kodenya, sobat bisa memasukan kode berikut, di edit html atau di bawah <body> atau di kolom +gadged.
<div id="list">
<ul>
<li><a href="#">ajax</a></li>
<li><a href="#">css</a></li>
<li><a href="#">design</a></li>
<li><a href="#">firefox</a></li>
<li><a href="#">flash</a></li>
<li><a href="#">html</a></li>
<li><a href="#">jquery</a></li>
<li><a href="#">PHP</a></li>
<li><a href="#">SEO</a></li>
<li><a href="#">www</a></li>
<li><a href="#">web</a></li>
<li><a href="#">xhtml</a></li>
</ul>
</div>
Buruan Pasang Iklan Anda Di DHE Dengan Harga Yang Terjangkau.Pajang bisnis online anda di DHE dan dapatkan keuntungan yang lebih dari penjualan produk bisnis anda.Buruan Pasang Iklan Anda Di DHE Dengan Harga Yang Terjangkau.Pajang bisnis online anda di DHE dan dapatkan keuntungan yang lebih dari penjualan produk bisnis anda.
24 Komentar
Oh ya mas emoticonnya gimana tuh? Keren abiss ...
- salam damai -
Logo icon bulet menyerupai emoticon dengan border biru dan dalam keadaan Poker Face adalah hak cipta dari Haekal Fikri. Anda boleh memajangnya namun tidak boleh menggunakannya., logo tersebut saya kembangkan dengan kode dasar dari salah satu master blogger indonesia mas Taufik Karim saya ucapkan kasih kepada beliau,dan jika sobat menemukan logo icon bullet yang sama dengan blog ini maka itu adalah murni hasil cloningan dari source blog ini karena saya tidak membagikan scriptnya secara umum.
itu tidak sepatutnya dipajang pada disclaimer mas haekal karena beberapa waktu lalu mas haekal meminta izin kepada mas taufik karim untuk meminjam logo nya untuk digunakan dimandart begitu pun juga pada ehp kalau saya sih sah-sah saja mas meniru tampilan blog saya toh saya juga terinspirasi dari blog lain juga tapi untuk logo iconnya
mas taufik karim sudah mencantumkannya penjelasannya pada disclaimer opick blog karena beberapa blog termasuk mandart mempunyai kesan mirip dengan logonya sehingga opick blog mengganti kembali logo blognya tersebut tetapi tidak mengganti nama pencipta icon bullet seperti pada blog mas ini, takutnya ntar jadi salah paham antara mas haekal dengan mas taufik...
nanti malah seperti saya dengan om ivan mas saya hanya menyarankan saja supaya blogger indonesia tidak berantam lagi bila mas haekal tidak mengindahkannya juga tidak papa... terima kasih :)
Yang pastinya mas imron menulis komentar seperti itu dengan maksud yang sangat baik, jangan sampai pertengkaran antar blogger terulang kembali seperti yang pernah menimpa pada diri mas imron sendiri karena bagi mas imron kita ini semua bersaudara.
Mungkin mas haekal mempunyai rasa ke khawatiran yang tinggi terhadap kode logo tersebut di copy oleh orang lain, atas ijin pinjam logo tersebut terhadap pemilik tunggal logo. dalam hal ini pemilik kode tersebut yaitu Taufik Karim. walaupun pada awalnya ijin tersebut hanya PINJAM dan sampai sekarang masing terpasang, bagi saya tidak jadi masalah
buat mas Imron terima kasih atas simpati nya
buat mas haekal terima kasih sudah memakai kreasi dari opic blog
santai saja... no problem... cleared......