jQuery হচ্ছে, javaScript er একটা Library. jQuery এর slogan হচ্ছে, “ write less, do more”.
আজকাল ওয়েবসাইট গুলা দেখতে অনেক সুন্দর এবং ব্যাবহারও বন্ধুসুলভ এবং এইসব সাইট এর ৯০% ই jQuery এর অবদান।
আগে যে কাজটা করতে ডেভলপার দের হাজার লাইন কোড লিখতে হতো এখন jQuery এক লাইন কোড ই যথেষ্ট।
HTML, javaScript এবং css খুব ই সহজ জিনিস। উপরের লিংক গুলা মন দিয়ে পড়লে, একদিনেই শেষ করা সম্ভব।
তার পড়েও যাদের on the fly শেখার অভ্যাস, তারা ইতস্তত না করে comment এ জিজ্ঞাসা করতে পারেন।
Download jQuery library: http://code.jquery.com/jquery-1.6.1.min.js
একটা folder খুলেন, নাম দেন ndh-tutorial-part-1
ndh-tutorial-part-1 Folder এর ভিতর jquery-1.6.1.min.js ফাইলটা কপি করেন।
ndh-tutorial-part-1 Folder এর ভিতর নতুন একটা html file খুলেন, নাম দেন part-1.html
নিচের code copy করে part-1.html file এ paste করেন। এবং ফাইল সেভ করেন।
<html>
<head>
<script src="jquery-1.6.1.min.js"></script>
<script>
$(document).ready(function(){
$("p").click(function(){
$(this).hide();
});
});
</script>
</head>
<body>
<p>If you click on me, I will disappear.</p>
</body>
</html>
এখন part-1.html ফাইলটা কোন একটা ব্রাউজার দিয়া ওপেন করেন।
একটা লেখা পাবেন “If you click on me, I will disappear.”
এটার উপর ক্লিক করেন আর মজা দেখেন।
লেখাটা গায়েব হয়ে যাবে।
পুরা জিনিসটা এক সাথে ডাউনলোড করতে পারেন এইখান থেকে :
ব্যাখ্যাগুলা একটু বরিং মনে হলেও ধৈর্য ধরে পড়েন please.
$(document).ready()- এই কথার মানে হচ্ছে, ব্রাউজার এ আপনার পেজ লোড পুরা complete হইলেই এর ভিতরের জিনিস গুলা execute হইব।
$("p").click(function(){
$(this).hide();
});
– এইখানে, $(p) দিয়া <p> If you click on me, I will disappear.</p> element টা select করছি।
$("p").click(function(){ - এইখানে বলছি, <p></p> , element এর উপর ক্লিক হইলে function() call হইব।
Function(){ - এর মাঝে বলা হইছে,
$(this).hide(); - এর মানে হচ্ছে, এই জিনিসটা( মানে <p></p> element) hide/ লুকায়া ফালাও।
এই $(this) নিয়া বিশাল গল্প আছে, কারো যদি interest থাকে, তাইলে ব্যাখ্যা করুম।
$(this).hide()
নগদ HTML element কে গায়েব করা.
$("#test").hide()এইচটিএমএল পেজে যতগুলো id="test" ওয়ালা জিনিস আছে সব গুলা গায়েব করা।
$(".test").hide()এইচটিএমএল পেজে যতগুলো class="test" ওয়ালা জিনিস আছে সব গুলা গায়েব করা।
$(".test"), $("#test") এইগুলো হচ্ছে, jQuery selector, এই বেপারে পরে বয়ান দিমু।
.hide(), হচ্ছে jQuery action
jQuery আসলে, এই selector আর action এরই খেলা।
theory দিয়া আর আপনাদের মুল্যবান সময় নষ্ট করবো না।
প্রতি পর্বে সহজ একটা উদাহরণ দিবো sample কোড সহ। তারপর কোড এর ব্যাখ্যা দিবো। আপনারা প্রশ্ন করবেন আমি উত্তর দিবো।
অবান্তর এবং যুগান্তর প্রশ্নের অপেক্ষাতে থাকলাম। সাড়া পেলে ২য় পর্ব এবং advance পর্ব লিখব। সবশেষে jQuery প্লাগইন ডেভেলপমেন্ট নিয়া লিখব।
আমি নাহিদ। বিশ্বের সর্ববৃহৎ বিজ্ঞান ও প্রযুক্তির সৌশল নেটওয়ার্ক - টেকটিউনস এ আমি 13 বছর 5 মাস যাবৎ যুক্ত আছি। টেকটিউনস আমি এ পর্যন্ত 3 টি টিউন ও 13 টি টিউমেন্ট করেছি। টেকটিউনসে আমার 0 ফলোয়ার আছে এবং আমি টেকটিউনসে 0 টিউনারকে ফলো করি।
গণনা যন্রের কারিগর।
আপনার সাথে আছি………….
চালিয়ে যান …………
$(this) এইটার গল্পটা যদি করতেন হাহলে মজা পাইতাম সকলে…………
আমি ওয়ার্ডপ্রেস এর এডিটর এর সাথে তেমন used to না।
টিউটরিয়াল লিখতে যে টাইম লাগে, post করতে তার চাইতে অনেক বেশি টাইম লাগে।
যেমন, মাঝে মাঝে কোড/ ট্যাগ গায়েব হয়ে যাচ্ছিল, ইমেজ অ্যাড করতে প্রথমে প্রব্লেম হইছিল পরে পারছি।
আমি যখন প্রিভিও দেখছিলাম, তখন তো কোড এতো সুন্দর দেখায় নাই, এখন তো ভালোই দেখাচ্ছে।
এটা কি এমনি এমনি হইছে?
অভিজ্ঞ টিউনার দের টিপস চাচ্ছি,
এই কাজ গুলা সহজে করার উপার থাকলে জানাবেন প্লিজ।
খুবই সুন্দর টিউন। আশা করি continue টিউন করে যাবেন। আর আমরা মনে হয় Code গুলো Picture করে দিলে ভাল হয় তাহলে কোন Code গুলো উল্টাপাল্টা দেখাবে না। ( এটা আমার Personal মতামত)
https://www.techtunes.io/web-design/tune-id/77692/
https://www.techtunes.io/review/tune-id/43637/#inserting-new-tune-images
https://www.techtunes.io/review/tune-id/43637/#adding-your-tuvatar
https://www.techtunes.io/review/tune-id/43637/#learn-to-tune
এই টিউন গুলো আপনাকে সাহায্য করবে। আর টেকটিউনস রিসোর্সের https://www.techtunes.io/category/techtunes-resource/ টিউন গুলোও আপনাকে সাহায্য করবে। ধন্যবাদ।
ধন্যবাদ, বেশ কাজের। অনেক help হইছে।
কিন্তু post এর process অনেক slow. এবং code present এ অনেক ঝামেলা করে।
fast করার কোন উপায় জানা আছে?
আপনারটা follow করছি।
ভাই খুব সুন্দর এবং কাজের টিউনস। আমিও শিখতে চাই। জাভাস্ক্রিপ্ট মোটামুটি জানি।
পরের পর্বের অপেক্ষায় রইল।
ভাই খুব সুন্দর এবং কাজের টিউনস। আমিও শিখতে চাই। জাভাস্ক্রিপ্ট মোটামুটি জানি।
পরের পর্বের অপেক্ষায় থাকলাম।
![আসুন jQuery শিখি :: jQuery Events [পর্ব-২]](https://dnc.techtunes.io/tDrive/tuner/nahidacm/79891/jquery.png "আসুন jQuery শিখি :: jQuery Events [পর্ব-২]")
বস্ আমি শিখতে চাই , সুন্দর টিউন !!
([email protected] ) মেইল এ আপনার ফোন নাম্বারটি দিলে যোগাযোগ করবো। অনেকগুলো প্রশ্ন ছিল।।