স্ক্রোলিং ব্যবহারকারীদের ওয়েব পৃষ্ঠা/দীর্ঘ নথি বাম এবং ডান বা উপরে এবং নীচে দেখতে দেয়। এটি বিষয়বস্তুর উপর নির্ভর করে অনুভূমিক এবং উল্লম্ব স্ক্রল বার যোগ করে সঞ্চালিত হতে পারে। স্ক্রোল বারের মাত্রা যেমন উচ্চতা এবং প্রস্থ ডিফল্টরূপে সেট করা হয়। যাইহোক, এগুলি তাদের সম্পর্কিত জাভাস্ক্রিপ্ট পদ্ধতির সাহায্যে কাস্টমাইজ করা যেতে পারে। একবার সেগুলি যোগ করা বা নথিতে সেট করা গেলে, ব্যবহারকারী বিল্ট-ইন ব্যবহার করে সহজেই তাদের সনাক্ত করতে পারে। স্ক্রোলটপ() ', এবং ' স্ক্রোল বাম() 'পদ্ধতি।
এই পোস্টটি jQuery-এ “scrollLeft()” পদ্ধতির উদ্দেশ্য এবং কার্যকারিতা ব্যাখ্যা করে।
jQuery-এ 'scrollLeft()' পদ্ধতি কি?
দ্য ' স্ক্রোল বাম() ” পদ্ধতিটি বিশেষভাবে অনুভূমিক স্ক্রোল বারের জন্য ডিজাইন করা হয়েছে যাতে পিক্সেলে এর অবস্থান সেট এবং পুনরুদ্ধার করা যায়। এটি নির্বাচিত HTML উপাদান স্ক্রোল বার অবস্থান গণনা করে। এটি বেশিরভাগ ডিভ, ধারক এবং বিভাগ উপাদানগুলিতে প্রয়োগ করা হয়।
সিনট্যাক্স (অনুভূমিক স্ক্রলবার অবস্থান সেট করুন)
$ ( নির্বাচক ) .স্ক্রোল বাম ( অবস্থান )
উপরের সিনট্যাক্সটি পূর্ণসংখ্যার মানকে তার ' অবস্থান ' টার্গেটেড নির্বাচকের অনুভূমিক স্ক্রল বার অবস্থান সেট করতে যুক্তি৷
সিনট্যাক্স (অনুভূমিক স্ক্রলবার অবস্থান পান)
$ ( নির্বাচক ) .স্ক্রোল বাম ( )
এই সিনট্যাক্সটি পিক্সেলে নির্বাচকের 'পজিশন' আর্গুমেন্ট মান প্রদান করে।
আসুন সংজ্ঞায়িত পদ্ধতিটি ব্যবহারিকভাবে ব্যবহার করি।
HTML কোড
প্রথমে, বর্ণিত HTML কোডটি দেখুন:
< অধ্যায় শৈলী = 'উচ্চতা: 150px; প্রস্থ: 200px; মার্জিন: অটো; বর্ডার: 2px কঠিন কালো; ওভারফ্লো: স্বয়ংক্রিয়;হোয়াইট-স্পেস: Nowrap;' >
< h2 > Linuxhint-এ স্বাগতম ! h2 >
অধ্যায় >
< বোতাম > অবস্থান নির্ধারণ করুন বোতাম >
কোডের উপরের লাইনগুলিতে:
- দ্য ' <বিভাগ> ” ট্যাগে HTML নথির ভিতরে একটি বিভাগ রয়েছে যা “স্টাইল” অ্যাট্রিবিউটের সাহায্যে কাস্টমাইজ করা হয়েছে।
- তৈরি অংশের ভিতরে, ' ” ট্যাগ উপশিরোনাম সংজ্ঞায়িত করে।
- সবশেষে, ' <বোতাম> ” ট্যাগ একটি বোতাম যোগ করে।
বিঃদ্রঃ: এই পোস্টের সমস্ত উদাহরণে প্রদত্ত HTML কোড অনুসরণ করুন।
উদাহরণ 1: স্ক্রলবার (অনুভূমিক) অবস্থান সেট করতে 'স্ক্রোলবাম()' পদ্ধতি প্রয়োগ করা
এই উদাহরণটি নির্দিষ্ট অবস্থানে স্ক্রলবার (অনুভূমিক) সেট করতে 'scrollLeft()' পদ্ধতি ব্যবহার করে।
jQuery কোড
প্রদত্ত jQuery কোড অনুসরণ করুন:
< লিপি src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js' >> লিপি >< লিপি >
$ ( নথি ) .প্রস্তুত ( ফাংশন ( ) {
$ ( 'বোতাম' ) .ক্লিক ( ফাংশন ( ) {
$ ( 'অধ্যায়' ) .স্ক্রোল বাম ( পঞ্চাশ ) ;
} ) ;
} ) ;
লিপি >
এই কোড স্নিপেটে:
- প্রথমে jQuery লাইব্রেরির CDN পাথ উল্লেখ করুন “