ADs by Techtunes ADs
ADs by Techtunes ADs

Supersized : সম্পূর্ণ ব্যাকগ্রাউন্ড/স্লাইডশো jQuery প্লাগিন

আমরা যারা ওয়েব ডেভলপিং এ কাজ করি তারা সকলেই এখন jQuery, Mootools ইত্যাদি ব্যবহার করে সুন্দর সুন্দর স্লাইডশো আমাদের সাইটে প্রদর্শন করি। আজকাল আমরা jQuery, Mootools ব্যবহার করে Flash এর চেয়েও ভালো ভালো এবং অনেক হালকা অ্যানিমেশেনের মাধ্যমে আমাদের সাইটের মান বৃদ্ধি করি করি। তাই আমাদের ছবিগুলোকে আরো সুন্দর করে উপস্থাপন করার জন্য আজ আমি jQuery এর একটা প্লগিন নিয়ে আলোচনা করবো এবং জানবো কি করে ব্যবহার করতে হয়।

ADs by Techtunes ADs

Supersized একটা jQuey প্লাগিন, যার মাধ্যমে আপনারা আপনাদের ছবির স্লাইডশো করতে পারবেন ইন্টারনেট ব্রাউজারের সম্পূর্ণ পর্দা জুড়ে।আসুন শুরুতে আমরা ডেমো দেখে নেই ।

Supersized : সম্পূর্ণ ব্যাকগ্রাউন্ড/স্লাইডশো jQuery প্লাগিন

ডেমো দেখার জন্য এখানে ক্লিক করুন

ডেমো ডাউনলোড করার জন্য এখানে ক্লিক করুন

Supersized প্লাগিন এর অপশন :

startwidth: 1024,
startheight: 640,
vertical_center: 1,
slideshow: 1,
navigation: 1,
transition: 1, //0-None, 1-Fade, 2-slide top, 3-slide right, 4-slide bottom, 5-slide left
pause_hover: 1,
slide_counter: 1,
slide_captions: 1,
slide_interval: 3000

নিচে অপশগুলোর বর্ণণা করা হলো ...

  • startwidth, startheight ছবির Ratio ক্যালকুলেশনের জন্য ব্যবহার করার হয় । এখানে আপনি আপনার সকল ছবি যে সাইজে আছে সেটা লিখবেন ।
  • vertical_center এর মান 1 হলে আপনার ছবিকে লম্বাভাবে মাঝখানে রাখবে, 0 হলে মাঝখানে রাখবে না ।
  • slideshow এর মান 1 হলে আপনার ছবিগুলোকে স্লাইডশো করবে, 0 হলে স্লাডশো করবে না ।
  • navigation এর মান 1 হলে আপনার কন্ট্রোল বাটন দেখাবে , 0 হলে দেখাবে না ।
  • transition এর মান 0 থেকে 5 পর্যন্ত পরিবর্তন করে আপনার স্লাইডশো এর ইফেক্ট পরিবর্তন করতে পারবেন ।
  • pause_hover এর মান 1 হলে মাউস ছবির উপর থাকলে স্লাইডশো থেমে যাবে ।
  • slide_counter এর মান 1 হলে স্লাইডশো দেখাবে ।
  • slide_caption এর মান 1 হলে স্লাইডশোতে নাম দেখাবে ।
  • slide_interval এর মান 3000 হলে স্লাইডশোতে ছবি ৩ সেকেন্ড পর পর পরিবর্তন হবে ।

আপনারা index.html ফাইলে এইসব অপশন এর মান পরিবর্তন করে আপনার স্লাইডশো কে নিজের মত করে সাজিয়ে নিতে পারবেন ।

আর ছবি পরিবর্তন করার জন্য index.html ফাইলের নিচের অংশ পরিবর্তন করুন ।

<div id="supersize">
<a href="http://www.mehedi.com.bd"><img title="চিতা" src="images/cheetahbeauty.jpg" alt="" /></a>
<a href="http://www.ojana.info"><img title="বাঁশ" src="images/bamboo.jpg" alt="" /></a>
<a href="http://www.banglarkobi.com"><img title="সবুজ পৃথিবী" src="images/worldongreenleaf.jpg" alt="" /></a>
</div>

এখানে আপনি নতুন ছবি যোগ করতে চাইলে images ফোল্ডারে ছবি লোড করে উপরের কোডের ভেতরে নতুন ছবির লিংক যোগ করুন ।

আশা করি এই প্লাগিন দিয়ে আপনারা আপনাদের সাইটের ছবি দেখার পেজকে আরো সুন্দর করতে পারবেন ।

ADs by Techtunes ADs

আপনাদের কোন সমস্যা হলে আমাকে জানাবেন ।

অজানা ইনফরমেশন

সম্প্রতিকালের অজানা ইনফরমেশন…

ADs by Techtunes ADs
Level 0

আমি মেহেদী.কম.বিডি। বিশ্বের সর্ববৃহৎ বিজ্ঞান ও প্রযুক্তির সৌশল নেটওয়ার্ক - টেকটিউনস এ আমি 10 বছর 4 মাস যাবৎ যুক্ত আছি। টেকটিউনস আমি এ পর্যন্ত 34 টি টিউন ও 280 টি টিউমেন্ট করেছি। টেকটিউনসে আমার 1 ফলোয়ার আছে এবং আমি টেকটিউনসে 0 টিউনারকে ফলো করি।


টিউনস


আরও টিউনস


টিউনারের আরও টিউনস


টিউমেন্টস

আমি আমার সাইটের এক অংশে এটা দিতে চাই পুরো পর্দ জুরে নয়। কি করবো?

মেরাজ আপনি এই স্লাইডশো কে এক অংশে শো করাতে চাইলে আপনাকে অনেক কষ্ট করতে হবে । বেশির ভাগ কোড আপনাকে পরিবর্তন করতে হবে । আমি বুঝতে পেরেছি আপনি কি চান, আপনি এই http://l4a.in/r2xtyi লিংক ভিজিট করুন । এখানে আপনার যে স্লাইডশো দরকার সেটা পাবেন । বুঝতে সমস্যা হলে জানাবেন । ধন্যবাদ ।

    না ভাই আমি চাচ্ছিলাম অটোমেটিক স্লাইডশো হবে। ক্লিক করেও হবে আবার।

    কেনো ভাইয়া আগেরটা তো অটো স্লাইডশো হয় । আপনি এটাও দেখতে পারেন http://l4a.in/re9gg4

    ধন্যবাদ ।

ভাইয়া http://www.nokiasymbianthemes.com/ এই সাইটের যে slideshow করা হয়েছে তা করে দেখান। আমfর খুব উপকার হবে

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