26/09/11

Tutorial cara menyembunyikan shoutbox|Ajax Style


Tutorial cara sembunyikan shoutbox Ajax style atau popup By blogger Blog TuTorial

Cara sembunyikan shoutbox ni adalah yang paling cool pada pendapat peribadi aku la..

Live demo ada di tepi tu..cuba2 la klik untuk tengok macamana rupa bentuk shoutbox tu

seperti biasa..login akaun blog anda..pergi ke design---add a gadget--- pilih html java script...
kemudian copy code di bawah ni


<div style='display:scroll;position:fixed;top:70px;right:-0px;'><script type="text/javascript" src="http://code.jquery.com/jquery-latest.pack.js"></script><script>$(document).ready(function(){$('a[name=modal]').click(function(e){e.preventDefault();var id=$(this).attr('href');var maskHeight=$(document).height();var maskWidth=$(window).width();$('#mask').css({'width':maskWidth,'height':maskHeight});var winH=$(window).height();var winW=$(window).width();$(id).css('top',winH/2-$(id).height()/2);$(id).css('left',winW/2-$(id).width()/2);$(id).fadeIn(2000);});$('.window .close').click(function(e){e.preventDefault();$('#mask').hide();$('.window').hide();});$('#mask').click(function(){$(this).hide();$('.window').hide();});});</script><style>img{border:none}#mask{position:center;left:0;top:0;z-index:9000;background-color:#000;display:none}#boxes .window{position:fixed;left:0;top:0;width:271px;height:477px;display:none;z-index:9999;padding:20px}#boxes #polska{background:none no-repeat 0 0 transparent;width:271px;height:480px;padding:56px 0 20px 5px}#closesb{padding:2px 0 0 0}#author{padding:8px 0 0 168px}</style><ul><center><a href="#polska" name="modal"><button>ShoutBox</button></a></center></ul><div id="boxes"><div id="polska" class="window"><center>

GANTIKAN TULISAN INI DENGAN CODE SHOUTBOX ANDA

</center><div id="author"></div><div id="closesb"><center><input type="button" value="Close" class="close"/></center></div></div><div id="mask"></div></div></div>



paste code code ni...lepas tu gantikan
 
GANTIKAN TULISAN INI DENGAN CODE SHOUTBOX ANDA

kemudian save..selesai..code javascript ni aku dan compress...sebab tu nampak semak dan padat...sebab antara semua code sembunyikan shoutbox code ni paling besar saiz dia..kira aku tweak untuk anda..selain itu butang untuk buka tu pun aku dah modified..sekian


Tiada ulasan:

entri ja

Related Posts Plugin for WordPress, Blogger...