Sunday, July 7, 2013

Add Blog Fading Effect For Bloggers

Credit - http://www.kogeelaytm.blogspot.com/2013/07/blogger-add-fading-fx.html#more

ဘေလာ့ဂါသမားမ်ားအတြက္ မိမိဘေလာ့အတြင္းရွိ လင့္ခ္မ်ားကိုႏွိပ္ပါက Fade ပံုစံျဖစ္ပီးလိုခ်င္တဲ့ Link ကိုေရာက္သြား တဲ့စတိုင္ေလးကို သြင္းနည္းပါ။ ကြ်န္ေတာ္ေျပာတာ သိပ္မရွင္းရင္ အေပၚက Demo လင့္ခ္မွာ ႏွိပ္ျပီး အဲ့ဒီ၀က္ဆုိက္ထဲက ပိုစ့္လင့္ခ္တစ္ခုခုကို ႏွိပ္ၾကည့္ပါ၊ အဲ့ဒီ FX ကိုေတြ ့ရွိပါလိမ့္မယ္။ ဘေလာ့ဂါအားလံုး စမ္းၾကည့္ခ်င္ရင္ေတာ့ ေအာက္က နည္းလမ္းအတုိင္း ဆက္ျပီးဖတ္လိုက္ပါ။

နည္းလမ္း :
  • Blogger သုိ့၀င္ျပီး Template က Edit HTML ကိုသြားပါ။
  • ကီးဘုတ္က Ctrl + F ကိုႏွိပ္ျပီး ကိုရွာပါ။
  • ေအာက္ကကုတ္ေတြကိုကူးျပီး ေပၚမွာျဖည့္ေပးလိုက္ပါ။
<script src='https://kogeelay.googlecode.com/files/pagefadein-out.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
$("body").css("z-index", "-10");
$("body").fadeIn(0);
$("a").click(function(event){
event.preventDefault();
linkLocation = this.href;
$("body").fadeOut(500, redirectPage); });
function redirectPage() {
window.location = linkLocation;
}
});
//]]>
</script>
<style>
html {
background-color: #F2F2F2; /* Color fading */
}
</style>
  • အကယ္သုိ့ သင့္ဘေလာ့က link အားလံုးကို ဒီ FX မထည့္ထားခ်င္ပဲ Older post, newer post နဲ့အခ်ိဳ ့မွာပဲထည့္ထားခ်င္ရင္ ေတာ့ေအာက္က ကုဒ္ကုိ အေပၚကအျပာေရာင္ ကုဒ္နဲ့ အစားထုိးလိုက္ပါ။
အစားထုိးဖုိ့ကိုလည္း ကြ်န္ေတာ္ ေတာင္းဆုိပါတယ္..။ ဘာလုိ့လဲဆုိေတာ့ တစ္ခ်ိဳ ့ Template မွာ Link အားလံုးကိုထည့္ရင္ Error ျဖစ္လို့ပါ။
  $(".post-title a, .blog-pager-older-link, .blog-pager-newer-link, .tabs").click(function(event){
ဒါဆုိ Save Template ႏွိပ္ျပီးသင့္ Blog က Link ေတြလိုက္ျပီးစမ္းႏိုင္ပါျပီး။ အဆင္ေျပၾကပါေစသတည္း။

No comments:

Post a Comment