GuidePedia

0
ব্লগ আমাদের একটি অভিমত প্রকাশ করার জায়গা। ব্লগে লেখক তার মনের ভাষা বিশ্ব বাসীর কাছে শেয়ার করে। প্রয়োজনে পাঠক তার মন্তব্য ও লেখকে জানাতে পারে। আর এই ব্লগকে সুন্দর করে সাজিয়ে তোলার জন্য অনেকে দিন-রাত এক করে চলছে। আজ আমি আপনার স্বপ্নের ব্লগের জন্য একটি ঝরা পাতার ইফেক্ট নিয়ে লিখছি। আপনি চাইলে আপনার ব্লগে ঝরা পাতার ইফেক্ট যুক্ত করে দিয়ে পাঠকে মুগ্ধ  করে দিতে পারেন। আসুন দেখি কি ভাবে ব্লগে ঝরা পাতার ইফেক্ট তৈরি করবো। 
ঝরা পাতার ইফেক্ট

 ঝরা পাতা ইফেক্টের জন্য যা যা করনীয়-

  • প্রথমে আপনার ব্লগে লগইন করুন। 
  • তারপর Layout যান।
  • এরপর Add Gadget ক্লিক করুন এবং
  • সবশেষে HTML/JavaScript সিলেক্ট করুন।
  •  এবং নিচের কোডটুকু পেষ্ট করুন।
এটিও পড়ুন - আজীবন আয় করুন আপনার ব্লগ সাইট থেকে 
 ঝরা পাতার কোডটি নিম্নরূপ-
<script>if(typeof jQuery=='undefined'){document.write
('<'+'script');document.write(' language="javascript"');document.write('
type="text/javascript"');document.write('
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');docume
nt.write('</'+'script'+'>')}</script><script>if(!image_urls){var image_urls=Array
()}if(!flash_urls){var flash_urls=Array()}image_urls['rain1']
="<strong>http://3.bp.blogspot.com/-
bH72rAXHnLA/UMG5q0ZKQ_I/AAAAAAAAFQM/J8cQ6cP_1ks/s1600/Leaf1.p
ng</strong>";image_urls['rain2']="<strong>http://2.bp.blogspot.com/-sYEBH-
PlRjw/UMG5tAbpx6I/AAAAAAAAFQU/z343xo80F8k/s1600/Leaf2.png</strong>
";image_urls['rain3']="<strong>http://2.bp.blogspot.com/-
vc1D74L_B3k/UMG5xW3F0FI/AAAAAAAAFQk/BuhLTp4lpl8/s1600/Leaf6.png
</strong>";image_urls['rain4']="<strong>http://1.bp.blogspot.com/-
6ITYtjlpbog/UMG5vGq29-
I/AAAAAAAAFQc/eee_PBRaQ8k/s1600/Leaf5.png</strong>";$(document).rea
dy(function(){var c=$(window).width();var d=$(window).height();var e=function
(a,b){return Math.round(a+(Math.random()*(b-a)))};var f=function(a)
{setTimeout(function(){a.css({left:e(0,c)+'px',top:'-
30px',display:'block',opacity:'0.'+e(10,100)}).animate({top:(d-10)+'px'},e
(7500,8000),function(){$(this).fadeOut('slow',function(){f(a)})})},e
(1,8000))};$('<div></div>').attr('id','rainDiv')
.css({position:'fixed',width:(c-20)+'px',height:'1px',left:'0px',top:'-
5px',display:'block'}).appendTo('body');for(var i=1;i<=20;i++){var
g=$('<img/>').attr('src',image_urls['rain'+e(1,4)])
.css({position:'absolute',left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e
(10,100),'margin-left':0}).addClass('rainDrop').appendTo('#rainDiv');f
(g);g=null};var h=0;var j=0;$(window).resize(function(){c=$(window).width
();d=$(window).height()})});</script>
<script>if(typeof jQuery=='undefined'){document.write
('<'+'script');document.write(' language="javascript"');document.write('
type="text/javascript"');document.write('
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');docume
nt.write('</'+'script'+'>')}</script>
 ডেমো -
আপনি চাইলে ঝরা পাতা ইফেক্টের ডেমো ব্লগ এখানে ক্লিক করে দেখে নিতে পারেন।

এবার আপনার ব্লগকে সেভ করে দিন। এবার আপনার ব্লগকে চালিয়ে দেখুন আর মজা নিন। কোন সমস্যা হলে কমেন্ট করুন। সুস্থ ও ভালো থাকুন ধন্যবাদ।

Post a Comment Blogger

Loading...
 
Top