jQuery Before and After
ခုတစ်လောဘာမှလည်း မလုပ်ဖြစ် စိတ်တွေလည်းညစ်၊ ဒါနဲ့ ဟိုစမ်းဒီစမ်း jQuery Before and After ဆိုတာစမ်းဖြစ်တယ်။ ဘာမှ သိပ်ရေးစရာ မလိုဘူး။ Myanmar Tutorials ကိုဝင်ကြည့်တော့ ကိုယ်တာဝန် မကျေသလို ဖြစ်နေတယ်။ ဒါနဲ့ ပျော်စရာလည်း ကောင်းအောင် အသုံးလည်း ဝင်အောင် Before and After လေးစမ်းပြီး တင်ပေးလိုက်ပါတယ်။
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script> <script src="js/jquery-ui.min.js" type="text/javascript"></script> <script src="js/jquery.beforeafter.js" type="text/javascript"></script>
လိုတဲ့ jQuery File တွေက အပေါ်မှာ ပြထားတဲ့ အတိုင်းပါပဲ။ before and after ကို ခေါ်တဲ့ code ကတော့
<script type="text/javascript">
$(function(){
$('#container').beforeAfter({
animateIntro : true,
introDelay : 3000,
introDuration : 500,
showFullLinks : false
});
});
</script>
HTML အစအဆုံးကတော့ ဖိုင်ကတော့
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Before And After</title>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/jquery.beforeafter.js"></script>
<script type="text/javascript">
$(function(){
$('#container').beforeAfter({
animateIntro : true,
introDelay : 3000,
introDuration : 500,
showFullLinks : false
});
});
</script>
</head>
<body>
<div id="container">
<div><img alt="before" src="images/before.jpg" width="424" height="305" /></div>
<div><img alt="after" src="images/after.jpg" width="424" height="305" /></div>
</div>
</body>
</html>
ဇစ်ဖိုင်လည်း တင်ပေးလိုက်တယ်ဗျို့ … index.html ကို Run လိုက်ပါ။
Facebook comments:
