1![Jquery (Slide Toggle) [Tutorial] Empty](https://2img.net/i/empty.gif)
Jquery (Slide Toggle) [Tutorial] 26th May 2010, 10:36 am
z3r0c00l
Administrator
စုစုပေါင်းရေးသားချက်များ : 392
မှတ်ပုံတင်သောနေ့ : 2009-08-20
ကျေးဇူးတင်ခံရမှု : 55
ဖိုရမ် အကျိုးဆောင် ရမှတ် : 611
သတိပေးခံရမှု :
မှတ်ပုံတင်သောနေ့ : 2009-08-20
ကျေးဇူးတင်ခံရမှု : 55
ဖိုရမ် အကျိုးဆောင် ရမှတ် : 611
သတိပေးခံရမှု :
ဒီပို႔စ္ဟာ Java Script မဟုတ္ပါဘူး။ Jquery ပါ။ ဒါေပမယ့္ Java Script လဲပါတဲ့အတြက္ ကၽြန္ေတာ္ Java Script ထဲမွာပဲေရးပါမယ္။ ကၽြန္ေတာ္အစက Jquery ကိုစိတ္မ၀င္စားဘူးဗ်။ (ဒီေလာက္ေကာင္းမွန္းလဲမသိခဲ့တာေပါ့) ဟိုတေလာက $ƴǩǾ နဲ႕ Online ေတြ႕ေတာ့မွ သူတင္ထားတဲ့ CM မွာ Jquery ကို ေတာ္ေတာ္ညႊန္းထားတယ္။ ဒါနဲ႕ကၽြန္ေတာ္လဲ ဘာရယ္မဟုတ္ဘူး ကလိၾကည့္လိုက္တာ။ ေတာ္ေတာ္လွတာပဲဗ်။ Design ပိုင္းကလန္ထြက္ေနတာပဲ။ ဟုတ္တယ္ $ƴǩǾ ေျပာသလိုပဲ။
CSS3 + Jquery = Very Nice ဆိုတာ ေတာ္ေတာ္မွန္တယ္ဗ်။ အဲဒါစလုပ္တုန္းကလဲ ကၽြန္ေတာ္ရြာပတ္သြားေသးတယ္။ ဒီလိုဒီလို................
File ကိုေခၚသံုးထားတယ္။ ဒါေပမယ့္ အဲဒီ Jquery.js ဆိုတဲ့ ဖိုင္ကိုရွာမေတြ႕ဘူး။ အမ်ိဳးမ်ိဳးစမ္းၾကည့္တယ္။ သူ႔ရဲ႕ Source ထဲလဲ၀င္ၾကည့္တယ္။ တစ္ခါတစ္ေလ Source ထဲမွာ ေခၚသံုးထားတဲ့ File ေတြပါတတ္တယ္ေလ။ ဥပမာ - style.css ဆိုတာမ်ိဳးေပါ့။ အဲဒီမွာလဲမပါဘူး။ ေနာက္ဆံုးတစ္ခုသတိရလိုက္တယ္။ ကၽြန္ေတာ္တို႔ webpage ေတြကို Save လုပ္ရင္ သူနဲ႕ပတ္သက္တဲ့ File ေတြအကုန္ပါတယ္ေလ။ကၽြန္ေတာ္လဲအဲဒါနဲ႕ အဲဒီ Page ကို Save လုပ္လိုက္တယ္။အဲဒီမွာရသြားေရာ........
ကၽြန္ေတာ္နမူနာလုပ္ထားတဲ့ File ေလးကိုၾကည့္ပါ။
သူ႔ရဲ႕ Code ကေတာ့ဒီမွာပါ။
သူ႕ရဲ႕ Js File ကေတာ့ ဒီမွာပါ။
Online မွာ Run ဖို႔အတြက္ Host တင္မယ္ဆိုရင္လဲ ႏွစ္ခုကို Host တူေအာင္တင္ပါ။ Host မတူဘူးဆိုရင္ src="jquery.js" ဆိုတဲ့ေနရာမွာ path ကို ေသခ်ာေအာင္ထည့္ေပးပါ။
အားလံုးအဆင္ေျပၾကပါေစ။
z3r0c00l
CSS3 + Jquery = Very Nice ဆိုတာ ေတာ္ေတာ္မွန္တယ္ဗ်။ အဲဒါစလုပ္တုန္းကလဲ ကၽြန္ေတာ္ရြာပတ္သြားေသးတယ္။ ဒီလိုဒီလို................
- Code:
http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_slide_toggle
File ကိုေခၚသံုးထားတယ္။ ဒါေပမယ့္ အဲဒီ Jquery.js ဆိုတဲ့ ဖိုင္ကိုရွာမေတြ႕ဘူး။ အမ်ိဳးမ်ိဳးစမ္းၾကည့္တယ္။ သူ႔ရဲ႕ Source ထဲလဲ၀င္ၾကည့္တယ္။ တစ္ခါတစ္ေလ Source ထဲမွာ ေခၚသံုးထားတဲ့ File ေတြပါတတ္တယ္ေလ။ ဥပမာ - style.css ဆိုတာမ်ိဳးေပါ့။ အဲဒီမွာလဲမပါဘူး။ ေနာက္ဆံုးတစ္ခုသတိရလိုက္တယ္။ ကၽြန္ေတာ္တို႔ webpage ေတြကို Save လုပ္ရင္ သူနဲ႕ပတ္သက္တဲ့ File ေတြအကုန္ပါတယ္ေလ။ကၽြန္ေတာ္လဲအဲဒါနဲ႕ အဲဒီ Page ကို Save လုပ္လိုက္တယ္။အဲဒီမွာရသြားေရာ........
ကၽြန္ေတာ္နမူနာလုပ္ထားတဲ့ File ေလးကိုၾကည့္ပါ။
- Code:
http://z3r0c00l.fileave.com/tryit.html
သူ႔ရဲ႕ Code ကေတာ့ဒီမွာပါ။
- Code:
<html>
<head>
<body style="background-image:url(upload.jpg)">
</body>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".flip").click(function(){
$(".panel").slideToggle("slow");
});
});
</script>
<style type="text/css">
div.panel,p.flip
{
margin:0px;
padding:5px;
text-align:left;
background:#transparent;
border:solid 1px #c3c3c3;
}
div.panel
{
height:1500px;
display:none;
}
</style>
</head>
<body>
<p class="flip"><b>A faster start to become a h4cK3R</b></p>
<div class="panel">
<p>If you are serous about hacking and dont
know were to start then i think this is for you...</p>
<p>Its called Backtrack 3 final.</p>
<p><img src="http://farm3.static.flickr.com/2130/2453337507_ac0b8e4f3b.jpg" width="450" height="302" alt="backtrack 3" />
</P>
<p>Download Back Track 3 Final you will need a high speed internet connection to download this file</p>
<p>Watch theVideo tutorial and make your self a backtrack3final.iso boot able disk</p>
<p>Now that you have your boot able Iso disk you need to put the disk into your cd drive and restart your computer. If you are with me so far then you will see this boot menu</p>
<p>You will need to pick the correct boot option... what boot option works on your computer this is up to you to figure out for your self... just simply press the up or down key and press enter... </p>
<p>My laptop will only boot up with the (VESA KDE) option...</p>
<p>Now if backtrack boots up with no errors then you should see something like this</p>
<p>If at any time you see this screen then you need to enter these 3 commands</P>
<p>root</p>
<p>toor</p>
<p>startx</p>
<p><img src="http://www.linuxhaxor.net/wp-content/uploads/2007/07/screenshot-69.png" width="900" height="604" alt="backtrack 3" />
</P>
</div>
</body>
</html>
သူ႕ရဲ႕ Js File ကေတာ့ ဒီမွာပါ။
- Code:
http://z3r0c00l.fileave.com/jquery.js
Online မွာ Run ဖို႔အတြက္ Host တင္မယ္ဆိုရင္လဲ ႏွစ္ခုကို Host တူေအာင္တင္ပါ။ Host မတူဘူးဆိုရင္ src="jquery.js" ဆိုတဲ့ေနရာမွာ path ကို ေသခ်ာေအာင္ထည့္ေပးပါ။
အားလံုးအဆင္ေျပၾကပါေစ။
z3r0c00l
