Fly menu

Copas kode berikut di Html/Javascript :

<style>
#kanan{margin:0 auto; height:148px; width:42px; top:250px; right:0px; z-index:10; position:fixed;}
#menu-kanan{overflow:hidden; position:relative; text-align:left; z-index:10;}
#menu-kanan ul{margin:10px 0;padding:0;list-style: none;}
#menu-kanan ul li a{display:block;text-decoration:none;text-indent:-99999px;width:32px; height:32px;}
#menu-kanan .slide-totop a{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieVkwAQm0vQl3xqgQhzilgyY7zhrJynChjUhrzukxiw5g_QQ-F_WgSp0ma6Nymg0o6a4CacBtc-jd2l7LbCZA6YFNiGt4kSGhBsbxHw8_A3jvo3AHte2aZflAmn2kPJpNkBi1Xo3os_7zL/s800/sprite_right.png); background-position:0 0; background-repeat: no-repeat;}
#menu-kanan .slide-totop a:hover {background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieVkwAQm0vQl3xqgQhzilgyY7zhrJynChjUhrzukxiw5g_QQ-F_WgSp0ma6Nymg0o6a4CacBtc-jd2l7LbCZA6YFNiGt4kSGhBsbxHw8_A3jvo3AHte2aZflAmn2kPJpNkBi1Xo3os_7zL/s800/sprite_right.png); background-position:-32px 0; background-repeat: no-repeat;}
#menu-kanan .slide-mail a{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieVkwAQm0vQl3xqgQhzilgyY7zhrJynChjUhrzukxiw5g_QQ-F_WgSp0ma6Nymg0o6a4CacBtc-jd2l7LbCZA6YFNiGt4kSGhBsbxHw8_A3jvo3AHte2aZflAmn2kPJpNkBi1Xo3os_7zL/s800/sprite_right.png); background-position:0 -96px; background-repeat: no-repeat;}
#menu-kanan .slide-mail a:hover {background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieVkwAQm0vQl3xqgQhzilgyY7zhrJynChjUhrzukxiw5g_QQ-F_WgSp0ma6Nymg0o6a4CacBtc-jd2l7LbCZA6YFNiGt4kSGhBsbxHw8_A3jvo3AHte2aZflAmn2kPJpNkBi1Xo3os_7zL/s800/sprite_right.png); background-position:-32px -96px; background-repeat: no-repeat;}
#menu-kanan .slide-print a{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieVkwAQm0vQl3xqgQhzilgyY7zhrJynChjUhrzukxiw5g_QQ-F_WgSp0ma6Nymg0o6a4CacBtc-jd2l7LbCZA6YFNiGt4kSGhBsbxHw8_A3jvo3AHte2aZflAmn2kPJpNkBi1Xo3os_7zL/s800/sprite_right.png); background-position:0 -64px; background-repeat: no-repeat;}
#menu-kanan .slide-print a:hover{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieVkwAQm0vQl3xqgQhzilgyY7zhrJynChjUhrzukxiw5g_QQ-F_WgSp0ma6Nymg0o6a4CacBtc-jd2l7LbCZA6YFNiGt4kSGhBsbxHw8_A3jvo3AHte2aZflAmn2kPJpNkBi1Xo3os_7zL/s800/sprite_right.png); background-position:-32px -64px;  background-repeat: no-repeat;}
#menu-kanan .switchview a{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieVkwAQm0vQl3xqgQhzilgyY7zhrJynChjUhrzukxiw5g_QQ-F_WgSp0ma6Nymg0o6a4CacBtc-jd2l7LbCZA6YFNiGt4kSGhBsbxHw8_A3jvo3AHte2aZflAmn2kPJpNkBi1Xo3os_7zL/s800/sprite_right.png); background-position:0 -32px; background-repeat: no-repeat;}
#menu-kanan .switchview a:hover, #menu-kanan a.on{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieVkwAQm0vQl3xqgQhzilgyY7zhrJynChjUhrzukxiw5g_QQ-F_WgSp0ma6Nymg0o6a4CacBtc-jd2l7LbCZA6YFNiGt4kSGhBsbxHw8_A3jvo3AHte2aZflAmn2kPJpNkBi1Xo3os_7zL/s800/sprite_right.png); background-position:-32px -32px; background-repeat: no-repeat;}
#kanan .latar-kanan{background-color : #000;border: 1px solid #282828;width:52px;height:148px;top: 250px;right: -52px;position: fixed;z-index:1;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript">
</script>
<script type="text/javascript">
 $(document).ready(function() {
 // hides the comments elements as soon as the DOM is ready
 $('#comments-block,.avatar-stock img').hide();


 // view the comments on clicking the noted link
 $('.readCom').click(function() {
 $('#comments-block').show('slow');
 return false;
 });


 // scroll body to 0px on click
 $('#back-top a').click(function () {
 $('body,html').animate({
 scrollTop: 0
 }, 800);
 return false;
 });
 });
</script>
<br />
<div id="kanan">
<div id="menu-kanan">
<ul>
<li id="back-top" class="slide-totop"><a href="#top" title="Kembali ke atas">Ke Atas</a></li>
<li class="switchview"><a href="#" title="Dokument">Dokument</a></li>
<li class="slide-print"><a title="Cetak artikel ini" onclick="javascript:print(); return false;" href="javascript:print(document)">Print artikel ini</a></li>
<li class="slide-mail"><a href="mailto:abib.ardana@ymail.com" title="Kirim email">Email</a></li>
</ul>
</div>
</div>

Klik Save
Hasilnya Lihat Disamping :)
Thank ..

• Ke Atas
• Dokument
• Print artikel ini
• Email