kp3 Marquee Post title test: 19 September 2009

kp3နည္ပညာ၊၄၈၊

Posted by KP-3မိသားစု | Labels: Blogger Hack

ဒီေန႔က်ေနာ္တင္မယ့္ Code ကေတာ့၊ က်ေနာ္မိတ္ေဆြအားလုံးႀကိဳက္ၾကမယ္လို႔ေမ်ာ္လင္႔ပါတယ္၊ RSS Reader ကိုသူမ်ားဟာနဲ႔မတူေအာင္တမူထူးရွားေအာင္ လုပ္ျခင္ရင္ေပါ့ေနာ္ ဒီနည္းေလးကေတာ့က်ေနာ္ေရာက္ခဲ့ဖူးတဲ့ ဘေလာ့ေတာ္ေတာ္မ်ားမ်ားမွာလည္း မေတြ႕ဘူးပါဘူး၊၊ မိမိရဲ႕ဘေလာ့ညာဘက္အေပၚေထာင့္ေလးမွာ RSS Reader ကိုထားတဲ့နည္းေလးပါ။ RSS IconကိုMouseနဲ႔ေထာက္လိုက္ရင္ စာမ်က္ႏွာကAutoလွန္သြားၿပီး မိမိရ့ဲRSSကိုCLICK လိုက္ရုံပါဘဲ၊ Codeကလည္းအရမ္းရွင္းပါတယ္။
ေအာက္မွာထည့္နည္းနဲ႔တကြCode
၁။click Layout
၂။click edit HTML
ေအာက္ကCodeကိုရွာပါ၊Press Ctrl + Fနဲ႔ရွာရင္ပိုၿပီးျမန္တာေပါ႔နာ္

</head>

ေတြ႕ၿပီဆိုရင္ေအာက္မွာ ေအာက္ကCodeကိုထည့္လိုက္ပါ၊

<style type='text/css'>
img { behavior: url(iepngfix.htc) }
#pageflip {
position: relative;
right: 0; top: 0;
float: right;
}
#pageflip img {
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
overflow: hidden;
position: absolute;
right: 0; top: 0;
background: url(http://www.wallheaven.com/subscribe.png) no-repeat right top;
}
</style>

<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){

//Page Flip on hover

$("#pageflip").hover(function() {
$("#pageflip img , .msg_block").stop()
.animate({
width: '307px',
height: '319px'
}, 500);
} , function() {
$("#pageflip img").stop()
.animate({
width: '50px',
height: '52px'
}, 220);
$(".msg_block").stop()
.animate({
width: '50px',
height: '50px'
}, 200);
});

});
</script>

ေအာက္ကCodeကုိထပ္ရွာပါ၊

<body>

ေတြ႕ၿပီဆိုင္ရင္ေအာက္မွာ ေအာက္ကCodeေလးကိုထပ္ထည႔္ေပးလိုက္ပါေနာ္။

<div id='pageflip'>
<a href='ဤေနရာတြင္မိမိႏွစ္သက္သည့္Linkကိုထည့္လိုက္ပါ'>
<img alt='' src='http://www.wallheaven.com/page_flip.png'/></a>
<div class='msg_block'></div>
</div>

(http://www.wallheaven.com/subscribe.png)ဒါကေတာ့background လင့္ပါဘဲ၊၊ မိမိႏွစ္သက္တာေရြးထည့္လို႔ရပါတယ္။

၃။Save Template button.ႏိုပ္ပါ ၿပီးပါၿပီ။။။
မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစျခင္ပါတယ္၊ kp3မွမိတ္ေဆြအားလုံးေက်းဇူးကမ႓ာ

kp3နည္ပညာ၊၄၈၊

Posted by KP-3မိသားစု | Labels: Blogger Hack, Blogger Tips, Blogger Tutorial, Blogger Widget

</head>

ေတြ႕ၿပီဆိုရင္ေအာက္မွာ ေအာက္ကCodeကိုထည့္လိုက္ပါ၊

<style type='text/css'>
img { behavior: url(iepngfix.htc) }
#pageflip {
position: relative;
right: 0; top: 0;
float: right;
}
#pageflip img {
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
overflow: hidden;
position: absolute;
right: 0; top: 0;
background: url(http://www.wallheaven.com/subscribe.png) no-repeat right top;
}
</style>

<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){

//Page Flip on hover

$(&quot;#pageflip&quot;).hover(function() {
$(&quot;#pageflip img , .msg_block&quot;).stop()
.animate({
width: &#39;307px&#39;,
height: &#39;319px&#39;
}, 500);
} , function() {
$(&quot;#pageflip img&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;52px&#39;
}, 220);
$(&quot;.msg_block&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;50px&#39;
}, 200);
});


});
</script>

ေအာက္ကCodeကုိထပ္ရွာပါ၊

<body>

ေတြ႕ၿပီဆိုင္ရင္ေအာက္မွာ ေအာက္ကCodeေလးကိုထပ္ထည႔္ေပးလိုက္ပါေနာ္။

<div id='pageflip'>
<a href='ဤေနရာတြင္မိမိႏွစ္သက္သည့္Linkကိုထည့္လိုက္ပါ'>
<img alt='' src='http://www.wallheaven.com/page_flip.png'/></a>
<div class='msg_block'></div>
</div>

(http://www.wallheaven.com/subscribe.png)ဒါကေတာ့background လင့္ပါဘဲ၊၊ မိမိႏွစ္သက္တာေရြးထည့္လို႔ရပါတယ္။

၃။Save Template button.ႏိုပ္ပါ ၿပီးပါၿပီ။။။
မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစျခင္ပါတယ္၊ kp3မွမိတ္ေဆြအားလုံးေက်းဇူးကမ႓ာ