Sponsorluk
jQuery এর সাহায্যে ওয়েবসাইটের ব্যাকগ্রাউন্ড ইমেজ পরিবর্তন [এনিমেশন] করা।
jQuery এর সাহায্যে ওয়েবসাইটের ব্যাকগ্রাউন্ড একটারপর একটা পরিবর্তন করা যায়। অনেক সহজেই।
এর জন্য jQuery কোড গুলোঃ
<script>
jQuery(window).load(function(){
var images = ['http://jakir.me/wp-content/uploads/2013/04/Forest-Highway.jpg',
'http://jakir.me/wp-content/uploads/2013/04/highway.jpg'];
var i = 0;
function changeBackground() {
jQuery('#thumbs').css('background-image', function() {
if (i >= images.length) {
i=0;
}
return 'url(' + images[i++] + ')';
});
}
// Call it on the first time
changeBackground();
// Set an interval to continue
setInterval(changeBackground, 5000);
});
</script>
কিভাবে কাজ করে তা একটু ব্যাখ্যা করি। আমরা একটা ভ্যারিয়েবল নিয়েছি যার নাম image. এর মধ্যে আমরা ব্যাকগ্রাউন্ডের জন্য ব্যবহৃত ইমেজের লিঙ্ক গুলো রেখেছি।
আরেকটি ভ্যারিয়েবল নিয়েছি i, যা দিয়ে ইমেজ গুলোর মধ্যে লুপ চালানো হয়েছে পরবর্তিতে।
changeBackground নামে একটা ফাংশন লিখেছি যার মধ্যে jQuery CSS একের পর এক ব্যাকগ্রাউন্ড সেট করছি। setInterval(changeBackground, 5000); কতক্ষন পর পর ব্যাকগ্রাউন্ড পরিবর্তন হবে তা সেট করে দিয়েছি। এই। আর কিছু না। অনেক সহজ, তাই না? আপনি ইচ্ছে করলে কিছু এনিমেশনও যোগ করতে পারেন।
সম্পুর্ন কোডঃ
<!DOCTYPE html>
<html>
<head>
<style>
body{
margin:0;
background:#444;
}
#thumbs{
width:1000px;
height:500px;
margin:0 auto;
padding:50px;
overflow:hidden;
}
#text{
padding:50px;
font-size:18px;
color:#000;
background:#ccc;
opacity:.8;
}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
jQuery(window).load(function(){
var images = ['http://jakir.me/wp-content/uploads/2013/04/Forest-Highway.jpg',
'http://jakir.me/wp-content/uploads/2013/04/highway.jpg'];
var i = 0;
function changeBackground() {
jQuery('#thumbs').css('background-image', function() {
if (i >= images.length) {
i=0;
}
return 'url(' + images[i++] + ')';
});
}
// Call it on the first time
changeBackground();
// Set an interval to continue
setInterval(changeBackground, 5000);
});
</script>
</head>
<body>
<div id="thumbs">
<div id="text">
স্বপ্ন দেখতে ভালোলাগে। ভালোলাগে আকাশ কুসুম(!) চিন্তা করতে। সময় পেলেই বই পড়ি। পাঠ্য বই না। গল্পের বই আর সাইন্স ফিকশন। বেশি বই পড়া হয়েছে আমার পিসির সামনে বসে PDF বই। এখন ও পড়ি। যার বেশির ভাগই PDF। ফ্রী বই গুলো ডাউনলোড করে কত যে বইয়ের টাকা বাঁচিয়ে দিয়েছি আল্লাহই জানে। বইয়ের লেখকেরা ক্ষমা করলেই হয়। প্রোগ্রামিং প্র্যাকটিস করলেও অলস। আর অলস বলেই হয়তো পড়তে ভালোবাসি। সবার কাছে দোয়া চাই যেন পড়তে পড়তেই মরতে পারি।
</div>
</div>
</body>
</html>
Site içinde arama yapın
Kategoriler
- Nulled
- Tech
- Job
- Hacking Course
- Art
- Causes
- Crafts
- Dance
- Drinks
- Film
- Fitness
- Food
- Oyunlar
- Gardening
- Health
- Home
- Literature
- Music
- Networking
- Other
- Party
- Religion
- Shopping
- Sports
- Theater
- Wellness
Read More
Google I/O 2026 এ নতুন ইতিহাস সৃষ্টি হয়ে গেল! Gemini 3.5 Flash এবং Gemini Spark এর সাথে থাকছে Gemini Omni যা করবে 32 Quadrillion Tokens প্রসেস আর মাত্র 12 Hours এ AI বানাবে আস্ত OS! | Techtunes | টেকটিউনস
অ্যাপল মানুষকে ফিরিয়ে নিচ্ছে হাত ঘড়ির যুগে… অসামান্য প্রাযুক্তিক উৎকর্ষতায়! একটি Apple...
IP.IM - IP Address নিয়ে আর টেনশন নয়! 🥳 সুপার ফাস্ট এই টুলটি Terminal এও চলবে! 🚀 | Techtunes | টেকটিউনস
অ্যাপল মানুষকে ফিরিয়ে নিচ্ছে হাত ঘড়ির যুগে… অসামান্য প্রাযুক্তিক উৎকর্ষতায়! একটি Apple...
ফোন চুরি রোধ করার সেরা অ্যান্ড্রয়েড অ্যাপ - Banglatech24.com
নিজের শখের ফোনটি চুরি হওয়া থেকে রক্ষা করতে চায় সবাই। তাই আগে থেকে অ্যান্ড্রয়েড ডিভাইসে একটি...
Smart School Android App v5.0 - Mobile Application for Smart School
Smart School Android App v5.0 – Mobile Application for Smart School Source Code Free...
📊🚀 Microsoft Text to Columns ব্যবহার করে Single Cell থেকে Multiple Data আলাদা করার পদ্ধতি 📂🔥
আসসালামু আলাইকুম সবাই কেমন আছেন…..? আশা করি সবাই আছেন । আমি আল্লাহর রহমতে ভালোই আছি ।আসলে...