kp3နည္းပညာ၊၃၄၃၊ဘေလာ့ List ေတြကို Scoll ပံုစံေျပာင္းနည္း

ဘေလာ့မိတ္ေဆြအားလံုးအတြက္လာပါျပီဗ်ာ၊အီးေမးလ္မွာေတာင္းဆိုထားလဲျဖစ္သလိုအရမ္းကိုအသံုး၀င္ ဆံုးထင္ပါတယ္။က်ေနာ္ေရာက္ခဲ့တဲ့ဘေလာ့ေတြအားလံုးမွာဘေလာ့ List ေတြကအရမ္းကိုအရွည္ၾကီးေတြ ျဖစ္တာေတြ႕ရပါတယ္။ဘေလာ့Listေတြနဲ႕ဆိုက္ဒ္ဘားကျပည့္ေနတယ္၊ဒါေၾကာင့္အားလံုးအတြက္အသံုးဝင္ ဆံုးနည္းပညာေလးဆိုရင္မွန္မယ္ထင္ပါတယ္။ဘေလာ့ကလည္းပိုျပီးလွပသြားမွာပါ။မသိေသးတဲ့ဘေလာ့ မိတ္ေဆြေတြကိုလမ္းညြန္ေပးၾကပါလို႕ေတာင္းဆိုခ်င္ပါတယ္။အဆင္မေျပရင္လည္းCommentsမွာထားခဲ့ ေပးၾကပါတယ္။ေအာက္မွာပံုနဲ႕တကြ Code ျပထားေပးပါတယ္။

၁။Design

၂။Edit HTML

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

]]></b:skin> 

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

/* Kp3bloglist Style */
#BlogList1 .widget-content { height: 200px; overflow: auto; }

၃။Save Template ႏိုပ္လိုက္ပါျပီးပါျပီ။မိမိရဲ႕ဘေလာ့ List ကိုျပန္ၾကည့္လိုက္ပါ။

ေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

Read More

kp3နည္းပညာ၊၂၄၂၊ဘေလာ့မွာ Dancing Links လို႕ေခၚတဲ့ Jquery Link Nudging ေလးသံုးနည္း

ဒီ Post ေလးကလည္းသံုးတဲ့သူေတြရွိေပမယ့္အရမ္းကိုနည္းပါေသးတယ္လို႕ေျပာရင္ရမယ္ထင္ပါတယ္၊ Jquery Link Nudging လင့္ခ္ေတြ Mouse နဲ႕ေထာက္လိုက္ရင္လင့္ခ္ေလးေတြကေရြ့ေနတယ္ဒါေၾကာင့္
Dancing Links  လို႕ေခၚပါတယ္။ကေနတဲ့အတိုင္းဆိုေတာ့က်ေနာ္ေအာက္မွာသြားၾကည့္လို့ရေအာင္လည္း DEMO လင့္ခ္ေလးပါျပထားေပးပါတယ္။

ဒီမွာသြားၾကည့္လို့လည္းရပါတယ္။

ပထမအဆင့္

၁။Layout

၂။Edit HTML

၃။ေအာက္က Code ကိုရွာပါ။

</head>

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

<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {
$('a.nudge').hover(function() { //mouse in
$(this).animate({ paddingLeft: '20px' },400);
}, function() { //mouse out
$(this).animate({ paddingLeft: 0 }, 400);
});
});
</script>
<!--DANCING-NUDGE-LINKS-STOPS-http://kp3family.blogspot.com-->

၅၊Save Tamplate ကိုႏိုပ္လိုက္ပါ။

ဒုတိယအဆင့္

၁။Layout

၂။Add a Gadget

၃။HTML/JavaScript Add မွာေအာက္က Code ကိုထည့္လိုက္ပါ။

<li><a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a><li>
<a href="http://kp3family.blogspot.com" class="nudge">kp-3နည္းပညာ</a></li></li></li></li></li></li></li></li></li>

၄။Save ႏိုပ္လို္က္ပါ။ ျပီးပါျပီ။ ။

မွတ္ခ်က္။ ။ http://kp3family.blogspot.com ႏွင့္ kp-3နည္းပညာေတြမွာမိမိရဲ့လင့္ခ္ေတြထည့္ေပးလို္က္ပါ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

Read More