ပုံေတြကို ZOOM နဲ႕ၾကည့္နိဳင္ေအာင္တင္နည္း

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

ကဲ အဆင့္ (၁) အေနနဲ႕ ၾကည့္လုိက္မယ္ေနာ္...
►1-  Blogger Singin ၀င္လိုက္ပါ။
►2-  Dashboard  ကိုသြားလိုက္ပါ။
►3-  Template    ကိုကလစ္ပါ..။
►4-  Edit  Html   ကို၀င္ပါ.. Process ကိုကလစ္ျပီးဆက္၀င္လုိက္ပါ။
►5-  Expand  Widget  Template  ကိုအမွန္ျခစ္ေပးဖို႕မေမ့ပါနဲ႕ေနာ္...။
►6-  Ctrl+F  (သို႕မဟုတ္) F3  အကူညီျဖင့္ ေပးထားတဲ့ ကုဒ္ကို ရွာလိုက္ပါ။

</head> tag ကိုရွာလုိက္ပါ ေတြ႕တာနဲ႕  သူ႕ေရွကကေန ေပးထားေသာ ေအာက္ကကုဒ္ေတြ ထည့္ေပးလိုက္ပါ...

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'/>
<script src='http://wierdwalker.googlecode.com/files/easyzoom.js' type='text/javascript'/>
<script type='text/javascript'>

jQuery(function($){

$(&#39;a.zoom&#39;).easyZoom();

});

</script>

    

ဆက္လက္ျပီးေတာ့   ]]></b:skin> tag  ကိုရွာလုိက္ပါအုံး ေတြ႕ျပီဆိုတာနဲ႕ သူ႕ေရွ႕ကဘဲေနာ္
ေအာက္ကေပးထားေသာကုဒ္ေတြ ထည့္လိုက္ပါ...

#easy_zoom{
width:600px;
height:400px; 
border:5px solid #eee;
background:#fff;
color:#333;
position:fixed;
top:35px;
left:50%;
overflow:hidden;
-moz-box-shadow:0 0 10px #555;
-webkit-box-shadow:0 0 10px #555;
box-shadow:0 0 10px #555;
/* vertical and horizontal alignment used for preloader text */
line-height:400px;
text-align:center;
}

ျပီၤးတာနဲ႕ မိမိတို႕ tempalte ကို save လုိက္ပါေနာ္..




ေနာက္... မိမိတို႕ တင္လုိက္တဲ့ ပုံကို zoom ဆြဲၾကည့္နိဳင္ဖို႕ အတြက္ ပုံတင္တဲ့အခါမွာ  လုပ္ရမဲ့ အခ်က္
ရွိပါေသးတယ္..အဲတာကေတာ့ ပို႕စ္တင္မဲ့ ေနရာကိုသြားလုိက္ပါေနာ္..

ပို႕စ္တင္တဲ့ ေနရာ ေရာက္တာနဲ႕ အေပၚက Html ဆိုတာကလစ္ပါ..ကလစ္ျပီးတာနဲ႕ ေအာက္မွာ ေပးထားတဲ့ ကုဒ္ကို ယူထည့္ေပးလိုက္ပါ.. အဲမွာဘဲေနာ္
ကုဒ္ထဲမွာ Image Url ဆိုတာေတြ႕မယ္ ႏွစ္ေနရာပါ..အဲေနရာေတြမွာ မိမိတို႕ တင္လိုတဲ့ ပုံရဲ႕
လင့္ကို ထည့္ေပးလုိက္ယုံပါဘဲ....

<div class="separator" style="clear: both; text-align: center;">
<a class="zoom" href="Image url" imageanchor="1" 
style="margin-left: 1em; margin-right: 1em;">
<img border="0" height="205" src="Image url" width="320" /></a></div>

မွတ္ခ်က္. .... Image Url ေနရာမွာ မိမိတို႕ ပုံလင့္နဲ႕ အစားထိုးရမည္။
                  205.....320  ေတြမွာ လိုအပ္သလို ေျပာင္းနိဳင္ပါသည္။

ေကေကေနာ္..မေကလဲ ေအာ္သာေအာ္ခဲ့ဗ်ာ............ေိေိ

ေကေကေနာ္..မေကလဲ ေအာ္သာေအာ္ခဲ့ဗ်ာ............ေိေိ

ဘေလာ့ခရီးသည္