Perbedaan ShoutMix ver1.0 dengan ver 2.0

Baru saja Saya meneliti antara kode ShoutMix ver1.0 dengan ver2.0. Kalau dilihat secara teliti, pastinya Sobat Blogger tahu dimana letak perbedaan antara ShoutMix ver1.0 dengan ver2.0. Apakah perbedaannya? Berikut ini daftar perbedaannya, antara ShoutMix ver1.0 dengan 2.0 yang telah Saya data, mulai dari JavaScript sampai Layout.

~^LiSt^~

 

Perbedaan	Ver1.0	Ver2.0
Kemudahan dalam mengedit Java Script	Sulit	Lebih Mudah
Gambar yang di tampilkan	Bagus	Lebih bagus
Floating efect	Nice	Nice
Border	Melengkung	Tegak-lurus
Ukuran gambar	Terserah	Terbatas/di atur manual

Kalau udah lihat perbedaannya, bisa tentukan JavaScript yang nanti akan Anda gunakan. Ini JavaScriptnya :

Versi 1.0

<!-- Begin Show Hide Floating - http://www.hitsuke.blogspot.com -- http://www.remo-xp.com--> <style type="text/css"> #hitsukeFX{ position:fixed; top:50px; z-index:+1000; } * html #hitsukeFX{position:relative;} .hitsukeFXtab{ height:550px; width:35px; float:left; cursor:pointer; background:url('http://i642.photobucket.com/albums/uu147/remoxp/Chatbox.png') no-repeat; } .hitsukeFXcontent{ float:left; border:2px solid #ffffff; -moz-border-radius-topleft:5px; -moz-border-radius-topright:5px; -moz-border-radius-bottomleft:5px; -moz-border-radius-bottomright:5px; background:#000000; padding:10px; } </style> <script type="text/javascript"> function showHidehitsukeFX(){ var hitsukeFX = document.getElementById("hitsukeFX"); var w = hitsukeFX.offsetWidth; hitsukeFX.opened ? movehitsukeFX(0, 40-w) : movehitsukeFX(40-w, 0); hitsukeFX.opened = !hitsukeFX.opened; } function movehitsukeFX(x0, xf){ var hitsukeFX = document.getElementById("hitsukeFX"); var dx = Math.abs(x0-xf) > 10 ? 5 : 1; var dir = xf>x0 ? 1 : -1; var x = x0 + dx * dir; hitsukeFX.style.right = x.toString() + "px"; if(x0!=xf){setTimeout("movehitsukeFX("+x+", "+xf+")", 10);} } </script> <div id="hitsukeFX"> <div class="hitsukeFXtab" onclick="showHidehitsukeFX()"> </div> <div class="hitsukeFXcontent"> <!-- Kode Shoutmix mu Disini -->

<!-- Tulis kode shoutmix disini --!>

<div style="text-align:right"> <a href="javascript:showHidehitsukeFX()"> [hide] </a> </div> </div> </div> <script type="text/javascript"> var hitsukeFX = document.getElementById("hitsukeFX"); hitsukeFX.style.right = (40-hitsukeFX.offsetWidth).toString() + "px"; </script>

Versi 2.0

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:right;
cursor:pointer;
background:url('http://www.effutio.com/wp-content/themes/effutio/images/contacttab.jpg') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #FFFFFFF;
background:#000000;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.left = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()"> </div>

<div class="gbcontent">

<!--Tulis kode shoutmix di sini --!>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.left = (30-gb.offsetWidth).toString() + "px";
</script></div></div></div>

NB : Untuk shoutMix versi 2.0 ganti tulisan yang berwarna orange dengan lawan katanya Untuk menampilkan float efek yang berbeda. ex : right ganti dengan left atau left ganti dengan right.