hello friends আশাকরি সবায় ভালো আছেন সুস্থ আছেন । আজকের টা সিএসএস ৩ (CSS3) স্টাইল দেখাবো কি ভাবে ব্লগে ইমেজ লিঙ্ক কে  Zoom করে দেখাবে । তাছাড়া আমরা ব্লগে পোস্টের সময় অনেক ছোট ইমেজ দিয়ে থাকি । এর মূলত কাজ হল ইমেজ উপর মাউস নিলে ফটো Zoom করে দেখাবে । অন্য উপায়ও আছে কিন্তু আমার কাছে এটা সুবিধাজনক মনে হয় । তাহলে চলুন দেখে নেওয়া যাক । 











কিভাবে এই ওয়েডগেট আপনার ব্লগে যুক্ত করবেন !.




  • প্রথমে আপনার ব্লগার ব্লগ লগইন করুন ।
  • ড্যাশবোর্ড থেকে Template → Edit HTML এ ক্লিক করুন ।
  • এবার আপনার কীবোর্ড এর CTRL+F প্রেস করে নিচের ট্যাগটি খোজ করুন ।


]]></b:skin>

  • উপরের ট্যাগ খুজে পেলে তার ঠিক আগে বা উপরে নিচের সিএসএস কোড গুলো বসিয়ে দিন ।




</style><style type="text/css">
/*URL: http://tomarijonnor.blogspot.com */
.hovergallery img{
-webkit-transform:scale(0.8); /*Webkit: Scale down image to 0.8x original size*/
-moz-transform:scale(0.8); /*Mozilla scale version*/
-o-transform:scale(0.8); /*Opera scale version*/
-webkit-transition-duration: 0.5s; /*Webkit: Animation duration*/
-moz-transition-duration: 0.5s; /*Mozilla duration version*/
-o-transition-duration: 0.5s; /*Opera duration version*/
}

.hovergallery img:hover{
-webkit-transform:scale(1.1); /*Webkit: Scale up image to 1.2x original size*/
-moz-transform:scale(1.1); /*Mozilla scale version*/
-o-transform:scale(1.1); /*Opera scale version*/
opacity: 1;
}
</style>




  •  এবার Save করুন আপনার কাজ শেষ ।



এবার ব্লগে গিয়ে যখন আপনি এই জুমিং ইফেক্ট যেকোনো পোস্টের যেকোনো ছবিতে করতে চান তখন class="hovergallery" নির্দিষ্ট ছবির <div> ট্যাগে দিতে হবে।





  • নিচে ভালো করে দেখেনিন ।


<a class="hovergallery" href="http://tomarijonno.blogspot.in/"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhNvBF5yToKfKC5O2RkfNDkcg7VE_haZSdqMXSMIQOQUZ4NKE4xMCQDx3hMvM_7898TcptzoTMxhI41PNTGsn6d-EAE_tFAcp1c-mOT7uEDwQ2ICaJsMofMTeDANWdUfGapye_1mDdM0SQ/s1600/zoom.png"/>




নোটঃ   উপরে লাল রঙ্গে ঘিরা অংশ নিজের ইচ্ছা মতো লিঙ্ক দিন । আর গোলাপি  রঙ্গে ঘিরা অংশ নিজের ইচ্ছা মতো ফটো দিন ।


আমার এই পোস্ট আপনার ভাল বা কাজে আসলে শেয়ার করুন আপনার বন্ধুদের মধ্যে এবং  কমেন্ট করতে ভুলবেন না ।কোন সমস্যা হলে অবশ্যই জানাবেন আমি হেল্প করবো ।  ভালো থাকবেন সুস্থ থাকবেন ধন্যবাদ ।


একটি মন্তব্য পোস্ট করুন

 
Top
sur songeet