JQuery ဖြင့် Link များကို လှပစေခြင်း

အခုတလော စာသိပ်ပြီး မရေးဖြစ်ဘူး။ ရေးရမယ့်စာတွေကို ပြောတာပါ။

• Esay JSP
• Happy Hacking
• Java 7 ရဲ့ အခန်းဆက်
• Essential Java API
• Easy B Shell
• XML ဆီသို့ ခြေလှမ်းများ
• Play Framework
• အခြေခံ Database
• အခြေခံ Web Design

ဒါပေမယ့် JSP အရောက်မှာ ထစ်နေသည်။ ရေးတော့ရေနေပါသည်။ Java EE နဲ့ပတ်သက်ပြီး Framework တွေပိုင်းမှာ အားကောင်းနေပေမယ့် အခြေခံနေရာတွေမှာ သိပ်ပြီး အားတက်မလာတာကို တွေ့ရသည်။ ဒါကြောင့်လည်း ဒီအချိန်မှာ JSP ရယ်လို့ လုပ်နေတဲ့သူ ရှားနေတာပါလားလို့ တွေးမိပါသည်။

ဒီနေ့ကတော့ tech4mm မှာ Security နဲ့ပတ်သက်သော အကြောင်းကို ရေးသားဖြစ်ပါသည်။ တဖန် မနေ့ညက Easy B Shell ရဲ့ Built In Command များ အကြောင်းကို ရေးခဲ့ပါသည်။ ဒါလည်း ထစ်နေသော ပိုစ်တစ်ခု ဖြစ်ပါသည်။ JSP တွင်လည်း JSTL အကြောင်းကို ရေးရင်း ထစ်နေခြင်းဖြစ်ပါသည်။

ရေးပြီးစိတ်ပြေလက်ပျောက်အနေနဲ့ TCP/IP အကြောင်းကို လေ့လာခဲ့သည်။ ၂နာရီလောက် စာဖတ်ပြီးသော် အနည်းငယ်ပျင်းလာပါသဖြင့် မြန်မာဂျာဗားယူဇာဘလောဂ်တွင် တစ်ခုခုပြင်မှပဲဟု စဉ်းစားမိပါသည်။

ဟုတ်ပြီ jQuery ကို သုံးပြီး တစ်ခုခု ရေးမှပဲဟု။ Top 10 post များရှိပါသည်။ ဒီ လင့်ခ်တွေကို လှုပ်လှုပ်ရှားရှား ဖြစ်အောင်လုပ်မှပဲဟု။

သူရဲ့ ဖွဲ့စည်းပုံက DIV / UL / LI / A ဟုဖြစ်သည်။ Top 10 သည် blogger ၏ plugin တစ်ခုကို သုံးထားပါသဖြင့် အတွင်းပိုင်းကို အလွယ်တကူ ပြုပြင်၍မရပေ။ ဒါနဲ့ div ကို ကြည့်သည်။ class မှာ popular-posts ဟု ရေးသားသားသောကြောင့် jQuery နဲ့ Access လုပ်နိုင်သည်ဟု တွေးမိသည်။

အရင်တစ်ခေါက်ရေးထားသော side menu တွင် jquery ကို သုံးထားသောကြောင့် အဲ့ဒီထဲတွင် ပြင်ရေးရန် ဆုံးဖြတ်လိုက်သည်။

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script>
$(document).ready(function() {

// Accordion Menu
$("#accordion").accordion({ autoHeight: false });


// Popular posts
$('div.popular-posts > ul > li > a').hover(
    function() { //mouse in
        $(this).animate({ paddingLeft: '20px' },400);
    }, 
    function() { //mouse out
        $(this).animate({ paddingLeft: 0 }, 400);
    }
);

// Tag cloud
$('a.tagcloud').hover(
    function() { //mouse in
        var size = parseFloat($(this).css('font-size'),10);
        $(this).animate({ fontSize : size * 3 },400);
    }, 
    function() { //mouse out
        var size = parseFloat($(this).css('font-size'),10);
        $(this).animate({ fontSize : size / 3 }, 400);
    }
);

});
</script>

အထက်ပါ Popular posts ကို ကြည့်ပါ။ $('div.popular-posts > ul > li > a') ဟု လင့်ခ် Tag ကို ဆက်သွယ်ပြီး၊ hover လုပ်ဆောင်ချက်ကို လုပ်ဆောင်စေပါသည်။ hover လုပ်ဆောင်ချက်၏ ပဋ္ဌမပါရာမီတာအဖြစ် ဘယ်ဘက်ကို peddingLeft လုပ်စေမည့် Animation ကို လုပ်ဆောင်စေမည့် လုပ်ဆောင်ချက်ကို သုံးပြီး၊ ဒုတိယပါရာမီတာအဖြစ် 0 px peddingLeft လုပ်ဆောင်စေမည့် လုပ်ဆောင်ချက်ကို ခေါ်ယူစေပါသည်။ နမှုနာကို စမ်းသပ်ကြည့်ပါ။

Popular Posts Sample

• မြန်မာ ဂျာဗားယူဇာ
• မြန်မာအိုင်တီပရို
• မြန်မာကျူတိုရီရယ်
• Tech4mm
• http://mmwai.org/

တဖန် Tag Cloud နမှုနာမှာ $('a.tagcloud').hoverဖြင့် Font Size ကို ၃ ဆကြီးစေခြင်း၊ ပြန်ငယ်စေခြင်းကို သုံးထားပါသည်။

Tag Cloud Sample

• မြန်မာ ဂျာဗားယူဇာ
• မြန်မာအိုင်တီပရို
• မြန်မာကျူတိုရီရယ်
• Tech4mm
• http://mmwai.org/

JQuery ကို အသုံးပြုခြင်း အားဖြင့် သင်၏ ဘလောဂ်ရှိ လင့်များကို လှပစေနိုင်ပါသည်။