ဘေလာ့မွာPopularPostsကို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 />


 ေအာင္ေအာင္(မကစ) ရဲ႕ ဘေလာ့ခရီးသည္ေလးအား အားေပးေနၾကတဲ့အတြက္ ေက်းဇဴးအထူးတင္ပါတယ္.. တုန္႕ျပန္မွဳအေနနဲ႕ fb like ေလးေတာ့ လုပ္ေပးခဲ့ၾကပါေနာ္.. တတ္စြမ္းသမွ် ေတြ႕ ရွိသမွ်ေလးေတြကို ျပန္လည္ မွ်ေ၀ေနပါ့မယ္...။ www.aungsanmks.blogspot.com 

www.ledimyethar.com

Posted in: Blogs Post