Monday, 25 May 2015

ပုံေလးေတြကို Slideshow နဲ႕လုပ္ျခင္လား

သည္နည္းေလးကေတာ့ မိတ္ေဆြတို႕ အေနနဲ႕ မိမိတို႕ ဘေလာ့ေလးေပၚမွာ ဆိုဒ္ဘားမွာေပါ့
ပုံေလးေတြကို စိုက္ရွိဳးေလးနဲ႕ တင္ျခင္သူမ်ားအတြက္ နည္းလမ္းေလးတစ္ခုပါ...သူက လြယ္ကူပါတယ္
ကုဒ္ေလးေတြ နဲ႕ ဖန္တီးထားတာမို႕ ထည့္လို႕ လြယ္သလို ပုံေတြကိုလည္း တပုံစီတင္မယ္ဆို ဆိုဒ္
ေနရာ ကုန္မယ္ေလ.. ခုလို တေနရာ ထဲကေန တင္ျခင္သေလာက္ ပုံေလးေတြကို slide show ပုံစံေလးနဲ႕
ဆိုေတာ့ လန္းသြားတာေပါ့ စမ္းၾကည့္လုိက္ပါေနာ္...


ထည့္နည္းကေတာ့ ေအာက္ကတိုင္းပါဘဲ.....

   ►1.  Login လုပ္လုိက္ပါ ဘေလာ့ကာကို
   ►2.  Layout ကိုကလစ္ရပါ့မယ္ မိမိတို႕  Dashboard ကေနေပါ့
   ►3.  Add a Gadget ကိုကလစ္ေပးလုိက္ပါ
   ►4.  HTML/Javascript. ကိုကလစ္ျပီး က်လာတဲ့ ေဘာက္ေလးထဲမွာဘဲ
   ►5.  ေအာက္ကေပးထားတဲ့ ကုဒ္ေတြကို ေကာ္ပီယူ ထည့္လိုက္ပါ

<style>
#slideshow {margin:50px auto;position:relative;width:240px;height:240px;padding:10px;box-shadow: 0 0 20px rgba(0,0,0,0.4);}
#slideshow > div {position:absolute;top:5px;left:-1px;right:10px;bottom:10px;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script>
$(function() {
$("#slideshow > div:gt(0)").hide();
setInterval(function() {
$('#slideshow > div:first')
.fadeOut(1000)
.next()
.fadeIn(1000)
.end()
.appendTo('#slideshow');
}, 3000);
});
</script>
<div id="slideshow">
<div>
<img alt="" class="icon-action" src="Image URL" /></div>
<div>
<img alt="" class="icon-action" src="Image URL" /></div>
<div>
<img alt="" class="icon-action" src="Image URL" /></div>
</div>

ကုဒ္ေတြကို ၾကည့္လုိက္ပါေနာ္...

Image URLေနရာမွာ မိမိတို႕ တင္လိုတဲ့ ပုံရဲ႕ လင့္ကိုထည့္ပါ
* 250x250ဆိုဒ္ေတြကို လိုသလို သုံးနိဳင္ပါတယ္.. ပုံၾကီးေနပါက ဆိုဒ္ ခ်ိန္ေပးပါ
အဆင္ေျပပါေစ...
မွတ္ခ်က္..... ပုံကို ဆိုဒ္...250 x 250 လုပ္တာ သင့္ေတာ္ဆုံးပါဘဲဗ်ာ.. ခုတင္တာက သေဘာျပထားျခင္းပါ... တင္မည္ဆိုပါက ဆိုဒ္ကို အဲတိုင္း ပုံေတြ လုပ္ေပးသင့္ပါတယ္...


ေအာင္ေအာင္(မကစ) ရဲ႕ ဘေလာ့ခရီးသည္ေလးအား အားေပးေနၾကတဲ့အတြက္ ေက်းဇဴးအထူးတင္ပါတယ္.. တုန္႕ျပန္မွဳအေနနဲ႕ fb like ေလးေတာ့ လုပ္ေပးခဲ့ၾကပါေနာ္.. တတ္စြမ္းသမွ် ေတြ႕ ရွိသမွ်ေလးေတြကို ျပန္လည္ မွ်ေ၀ေနပါ့မယ္...။ အဆင္မေျပတာမ်ားရွိခဲ့ပါက...cbox မွာ ေျပာခဲ့ၾကပါေနာ္..
<<<မန္ဘာ၀င္ျပီး...Fb Like ျခင္းျဖင့္ အားေပးၾကပါေနာ္>>>
ေအာင္ေအာင္(မကစ) ပိုင္ဆိုင္ေသာ ေနရာေလးမ်ားကိုလာလည္ၾကပါ။


ဘေလာ့ခရီးသည္သို႕ { ဒီမွာ } သြားလိုက္ပါ
ဘေလာ့ဆုိင္ရာနည္းပညာမ်ား{ ဒီမွာ } သြားလိုက္ပါ
စြယ္စုံစာအုပ္စင္{ ဒီမွာ } သြားလိုက္ပါ

ၾကိဳက္ပါသလား+

0 comments:

Post a Comment