Sponsored
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>
Search
Categories
- Nulled
- Tech
- Job
- Hacking Course
- Art
- Causes
- Crafts
- Dance
- Drinks
- Film
- Fitness
- Food
- Games
- Gardening
- Health
- Home
- Literature
- Music
- Networking
- Other
- Party
- Religion
- Shopping
- Sports
- Theater
- Wellness
Read More
হোয়াটসঅ্যাপে অটো রিপ্লাই চালু করার নিয়ম - Banglatech24.com
বর্তমানে হোয়াটসঅ্যাপ ব্যবহার করেনা, এমন স্মার্টফোন ব্যবহারকারী খুঁজে পাওয়া মুশকিল। প্রাইভেসি...
CrypLab v2.0 - Crypto Marketplace and Auction Platform Script
CrypLab v1.0 – Crypto Marketplace and Auction Platform PHP Script Free Download. Cryp...
GitHub - byoungd/up: An advanced guide which might benefit you a lot 🎉 . 韩先凯的人生进阶指南 人生进阶指南 离谱的人生 人生进阶 AI学习 AI指南 韩先凯的AI学习指南 英语学习指南/英语学习教程/英语学习/学英语
title
人生进阶指南|AI 时代终身学习
description
《人生进阶指南》帮助普通人在 AI...
অ্যানাকোন্ডা vs অজগর কোনটা সবচেয়ে বড় সাপ? ভিডিওসহ | Techtunes | টেকটিউনস
‘নারী’ মানে প্রথম যে কথাটি আসে, তা হলো ‘মা’। Rubel Oron