Popular post ကို slide ေျပာင္းမယ္

ေတြတဲ့အတိုင္းပဲေနာ္ Slide သြားေနလိတ္မယ္
 ေရးခ်င္ဘူးပ်င္းတယ္ခိခိ.... ပံုဖ်က္ရတာကိုေတာ့စိတ္မရွည္ဘူး ဒါေပမဲ့ေရးလိုက္တယ္ဗ်ာ

သူငယ္ခ်င္း တစ္ေယာက္ေတာင္းဆိုလို့ပါေနာ္.......ခိခိ  စမယ္

 အပၚမွာေတြ႕တဲ့အတိုင္းပဲေနာ္  ADD A GADGE နွိတ္ ေအာက္ပံုကိုၾကည့္

ေပၚျပဴလာပိုစ့္ထုတ္ျပီး SAVE လိုက္ေပါ့ေနာ္ ထုတ္ျပီးသားလူေတြြက ေတာ့ ဒီေအာက္အဆင့္ကစလုပ္ေနာ္....

ေအာက္ပံုကို ၾကည့္လိုက္ပါဦးေနာ္.

ေဘးဘားက ADD A GADGET ကုိနွိတ္ပါ

ေအာက္ပံုေလးကိုၾကည့္ပါ

HTML ထည့္ျပီးေတာ့ ေအာက္မွာ ေပးထားတဲ့ HTML COD ေတြကူျပီထည့္လိုက္ပါ

ျပီးရင္ SAVE လိုက္ပါ က်ြန္ေတာ္တို့အေပၚမွာထုတ္ထားတဲ့ Popular Pot ဟာ Slide ျဖစ္ေနမယ္

Popular Pot လုပ္ထားေသာေဘာင္ကို ၾကိဳက္တဲ့ေနရာေရႊလို့ရပါတယ္ေနာ္

အဆင္မေျပရင္ aunglaybc.blogspot.com@gmail.com အက္လိုက္ေနာ္ 

ေမးျခင္တာေမး ေျဖခ်င္တာေျဖေပးမယ္ ခိခိ..........။

ေအာက္မွာကုဒ္ယူပါ

<style> <br /> @charset "utf-8"; <br /> /* CSS Document */ <br /> .lof-slidecontent, .lof-slidecontent a { <br /> color:#FFF; <br /> } <br /> .lof-slidecontent a.readmore{ <br /> color:#58B1EA; <br /> font-size:95%; <br /> <br /> } <br /> .lof-slidecontent{ <br /> position:relative; <br /> overflow:hidden; <br /> border:#F4F4F4 solid 1px; <br /> } <br /> .lof-slidecontent .preload{ <br /> height:100%; <br /> width:100%; <br /> position:absolute; <br /> top:0; <br /> left:0; <br /> z-index:100000; <br /> text-align:center; <br /> background:#FFF <br /> } <br /> .lof-slidecontent .preload div{ <br /> height:100%; <br /> width:100%; <br /> background:transparent url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/load-indicator.gif) no-repeat scroll 50% 50%; <br /> } <br /> .lof-main-outer{ <br /> position:relative; <br /> height:100%; <br /> width:625px; <br /> z-index:3px; <br /> overflow:hidden; <br /> } <br /> <br /> /*******************************************************/ <br /> .lof-main-item-desc{ <br /> z-index:100px; <br /> position:absolute; <br /> bottom:50px; <br /> left:0px; <br /> width:350px; <br /> background:url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/bg_trans.png); <br /> height:100px; <br /> /* filter:0.7(opacity:60) */ <br /> padding:10px; <br /> } <br /> .lof-main-item-desc p{ <br /> margin:0 8px; <br /> padding:8px 0 <br /> } <br /> .lof-main-item-desc h3{ <br /> padding:0; <br /> margin:0 <br /> } <br /> .lof-main-item-desc h2{ <br /> padding:0; <br /> margin:15px 0 0 0px; <br /> } <br /> .lof-main-item-desc h3 a{ <br /> margin:0; <br /> background:#C01F25; <br /> font-size:75%; <br /> padding:2px 3px; <br /> font-family:"Trebuchet MS",Trebuchet,Arial,Verdana,sans-serif; <br /> text-transform:uppercase; <br /> text-decoration:none <br /> } <br /> .lof-main-item-desc h3 a:hover{ <br /> <br /> text-decoration:underline; <br /> } <br /> .lof-main-item-desc h3 i { <br /> font-size:70%; <br /> } <br /> <br /> /* main flash */ <br /> ul.lof-main-wapper{ <br /> /* margin-right:auto; */ <br /> overflow:hidden; <br /> background:transparent url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/load-indicator.gif) no-repeat scroll 50% 50%; <br /> padding:0px; <br /> margin:0 !important; <br /> position:absolute; <br /> overflow:hidden; <br /> } <br /> <br /> ul.lof-main-wapper li{ <br /> overflow:hidden; <br /> padding:0px !important; <br /> margin:0px; <br /> float:left; <br /> position:relative; <br /> } <br /> .lof-opacity li{ <br /> position:absolute; <br /> top:0; <br /> left:0; <br /> float:inherit; <br /> } <br /> ul.lof-main-wapper li img{ <br /> padding:0px !important; <br /> } <br /> <br /> /* item navigator */ <br /> .lof-navigator-wapper { <br /> position:absolute; <br /> bottom:10px; <br /> right:10px; <br /> background:url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/transparent_bg.png) repeat; <br /> padding:5px 0px; <br /> } <br /> .lof-navigator-outer{ <br /> position:relative; <br /> z-index:100; <br /> height:180px; <br /> width:310px; <br /> overflow:hidden; <br /> color:#FFF; <br /> float:left <br /> } <br /> ul.lof-navigator{ <br /> top:0; <br /> padding:0; <br /> margin:0; <br /> position:absolute; <br /> width:100%; <br /> background:none !important; <br /> margin-top: 0 !important; <br /> margin-left: 0 !important; <br /> margin-right: 0 !important; <br /> } <br /> ul.lof-navigator li{ <br /> cursor:hand !important; <br /> cursor:pointer !important; <br /> list-style:none !important; <br /> padding:0 !important; <br /> margin-left:0px !important; <br /> overflow:hidden !important; <br /> float:left !important; <br /> display:block !important; <br /> <br /> text-align:center !important; <br /> <br /> } <br /> ul.lof-navigator li img{ <br /> border:#666 solid 3px; <br /> } <br /> ul.lof-navigator li.active img, ul.lof-navigator li:hover img { <br /> border:#A8A8A8 solid 3px; <br /> } <br /> .lof-navigator-wapper .lof-next, .lof-navigator-wapper .lof-previous{ <br /> display:block; <br /> width:22px; <br /> height:30px; <br /> color:#FFF; <br /> cursor:pointer; <br /> <br /> } <br /> .lof-navigator-wapper .lof-next { <br /> float:left; <br /> text-indent:-625px; <br /> margin-right:5px; <br /> background:url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/arrow-l.png) no-repeat right center; <br /> } <br /> .lof-navigator-wapper .lof-previous { <br /> float:left; <br /> text-indent:-625px; <br /> margin-left:5px; <br /> background:url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/arrow-r.png) no-repeat left center; <br /> } <br /> #lofslidecontent45 {width:625px;height:200px;} <br /> .lof-main-outer {width:625px; height:200px;} <br /> <br /> .lof-main-wapper img {height:200px !important; width:625px !important} <br /> .lof-navigator-wapper img {height:32px !important; width:80px !important} <br /> </style> <br /> <br /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> <br /> <script type="text/javascript" src="http://accordion-for-blogger.googlecode.com/svn/trunk/jquery.easing.js"></script> <br /> <script language="javascript" type="text/javascript" src="http://accordion-for-blogger.googlecode.com/svn/trunk/scriptlofblogv2.js"></script> <br /> <script type="text/javascript"> <br /> $(document).ready( function(){ <br /> var buttons = { previous:$('#lofslidecontent45 .lof-previous') , <br /> next:$('#lofslidecontent45 .lof-next') }; <br /> <br /> $obj = $('#lofslidecontent45').lofJSidernews( { interval : 4000, <br /> direction : 'opacitys', <br /> easing : 'easeOutBounce', <br /> duration : 1200, <br /> auto : true, <br /> maxItemDisplay : 10, <br /> navPosition : 'horizontal', // horizontal <br /> navigatorHeight : 32, <br /> navigatorWidth : 80, <br /> mainWidth:625, <br /> buttons : buttons} ); <br /> }); <br /> </script><br /><br />


အဆင္ေျပသလိုျပန္လည္ Share ႏိုင္ပါသည္
www.demonstar123.blogspot.com