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
Copas kode dibawah ini letakan diatas </head>
Catatan
untuk demonya silahkan anda tarik kebawah scrool pada samping kanan browser anda
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
untuk demonya silahkan anda tarik kebawah scrool pada samping kanan browser anda
terima kasih
baru di coba tadi n berhasil