Membuat main menu blog berfungsi seperti Frame

Postingan kali ini saya akan berbagi pada sobat blogger tentang bagaimana menjadikan main menu berfungsi seperti frame... Langsung aja gan ikuti Step dibawah ini
Step 1

Copas kode dibawah ini letakan diatas </head>

<style type='text/css'>
/*<![CDATA[*/
#mblSocialFloat {
clear:both;padding: 6px 0;
display:block;background:#FFFFFF;}
#mblSocialFloat td{
padding:4px;margin:0;
border:none;}
#mblSocialFloat td iframe{
max-width:82px;
width:82px !important;}
#mblSocialFloat.mblFloatSocial{
position: fixed;
top:0;z-index:9999999;
border-bottom:1px solid#ccc;
-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.15);
-moz-box-shadow:0 1px 1px rgba(0,0,0,0.15);
box-shadow:0 1px 1px rgba(0,0,0,0.15);} /*]]>*/
</style>

<script type='text/javascript'>
/*<![CDATA[*/ // Set the Top Offset $theOffset = 0; jQuery(document).ready(function(b){var a=b("#mblSocialFloat");
a.wrap('<div id="mblSocialPlaceholder"></div>').closest("#mblSocialPlaceholder").height(a.outerHeight());
a.width(a.outerWidth());e=a.offset().top-$theOffset;
b("#mblSocialFloat iframe[src*=plusone]").closest("div").css("max-width","82px");
b(window).scroll(function(){d=b(this).scrollTop();d>=e?a.addClass("mblFloatSocial"):a.removeClass("mblFloatSocial");f=b(".post");
if(f.length!=0){c=f.outerHeight()+f.offset().top;
d>=c?a.stop().animate({top:"-150px"}):a.stop().animate({top:$theOffset+"px"})}else d>=e?a.css("top",$theOffset+"px"):a.css("top","0")})}); /*]]>*/
</script>

<script src='http://mbl-flipper-google-blogger.googlecode.com/files/mbl_blogger_pinit.js' type='text/javascript'/>

<script type='text/javascript'>
/*<![CDATA[*/ // Twitter (function(a,b,c){var d=a.getElementsByTagName(b)[0];
if(!a.getElementById(c)){a=a.createElement(b);a.id=c;a.src="//platform.twitter.com/widgets.js";d.parentNode.insertBefore(a,d)}})(document,"script","twitter-wjs");
// Google + (plus) (function(){var a=document.createElement("script");
a.type="text/javascript";a.async=true;a.src="https://apis.google.com/js/plusone.js";
var b=document.getElementsByTagName("script")[0];b.parentNode.insertBefore(a,b)})(); // Stumbleupon (function(){var a=document.createElement("script");
a.type="text/javascript";a.async=true;a.src="https://platform.stumbleupon.com/1/widgets.js";var b=document.getElementsByTagName("script")[0];
b.parentNode.insertBefore(a,b)})(); // Digg (function(){var a=document.createElement("SCRIPT"),b=document.getElementsByTagName("SCRIPT")[0];
a.type="text/javascript";a.async=true;a.src="http://widgets.digg.com/buttons.js";b.parentNode.insertBefore(a,b)})(); /*]]>*/
</script>
Step 2

Dan kode dibawah ini yang akan anda gunakan untuk meletakan apa yang akan jadikan frame....


<divclass='mblSocialFloat'id='mblSocialFloat'>
<tableclass='mblSocialFloat'width='100%'>
Letakan code main menu anda disini
</table> </div>


Selamat Mencoba


Catatan

untuk demonya silahkan anda tarik kebawah scrool pada samping kanan browser anda

You may like these posts