ব্লগ স্পোট এ টাইপিং ইফেক্ট দেয়া
আমরা অনেকেই শখ করে ব্লগ এ ওয়েব সাইট তৈরী করে থাকি। সুন্দর করে সাজাই। আজ আমি আপনাদের একটি টাইপিং ইফেক্ট সংযুক্ত করার কোড দেয়া শিখাবো। আগে...
http://total-sw.blogspot.com/2011/12/blog-post_4962.html
আমরা অনেকেই শখ করে ব্লগ এ ওয়েব সাইট তৈরী করে থাকি। সুন্দর করে সাজাই। আজ আমি আপনাদের একটি টাইপিং ইফেক্ট সংযুক্ত করার কোড দেয়া শিখাবো। আগে আমার সাইট দেখুনhttp://total-sw.blogspot.com/। পাশেই ইফেক্ট।
প্রথমে ব্লগ এ লগ ইন করুন। তারপরে ডিজাইনে ক্লিক করুন। তারপরে নিচের ছবির মত এড এ গেজেট এ ক্লিক করুন
তারপরে একটি এড এ গেজেট নামে বক্স আসলে সেখান থেকে আপনাকে এইজটিএমএল/জাভা ইস্ক্রিপ্ট এ ক্লিক করুণ। আমার ছবিতে দেয়া নীল বর্ডার দেখুন-
এবার প্লাস দেয়া চিহ্ন তে ক্লিক করুন। তাহলে একটি বক্স আসবে । টাইটেল লিখা বক্সে কিছূ লিখার প্রয়োজন নেই। কন্টেন বক্সে নিচের কোড লিখুন এবং সেভ করুন। তারপরে উপরের সেভ এ ক্লিক করে প্রিভিউ দেখুন।
<script src="js/button.js" type="text/javascript"></script>
<script language="JavaScript">
<!--
var text="আজমল'র ব্লগ-এ স্বাগতম<br/>আশা করি এই সাইটের মাধ্যমে আপনি অনেক কিছু শিখতে পারবেন নিয়মিত ব্রাইজ করুন। এই সাইটের মেম্বার হলে আপনি সকল টপিক ই-মেইলের মাধ্যমে পেয়ে যাবেন। যে টপিকটি বুঝতে সমস্যা হবে, তার নিচে মন্তব্য করে জানান। অথবা আমাকে ই-মেইল করে জানান। আমি অবশ্য সেই সমস্যার সমাধান করার চেষ্টা করবো ইনশাআল্লাহ।<br />E-mail: kabbokatha08@gmail.com. Mobile: 019 1471 8299<br />";
var delay=50;
var currentChar=1;
var destination="[not defined]";
function type()
{
if (document.getElementById)
{
var dest=document.getElementById(destination);
if (dest)// && dest.innerHTML)
{
dest.innerHTML=text.substr(0, currentChar);
//dest.innerHTML+=text[currentChar-1];
currentChar++
if (currentChar>text.length)
{
currentChar=1;
xx = document.getElementById(destination).innerHTML
document.getElementById(destination).innerHTML=xx + "<br />"
}
else
{
setTimeout("type()", delay);
}
}
}
}
function startTyping(textParam, delayParam, destinationParam)
{
text=textParam;
delay=delayParam;
currentChar=0;
destination=destinationParam;
type();
}
//-->
</script>
<script type="text/javascript">
window.onload = function () {
startTyping(text, 60, "message");
}
</script>
<style type="text/css">
#message {
width:100%;
margin:0px auto;
font-family:"Courier New", Courier, monospace;
padding:2px;
height:100px;
color:#FF00FF;
text-align:left;
margin-top:10px;
}
</style>
<div id="container">
<div id="warper">
<div class="warper-main">
<div id="body-main">
<div class="body-top-box">
<div id="message" style="width: 200; height: 80">
</div></div>
</div>
</div>
</div>
</div>
কিন্তু একটি সমস্যা হলো তা এটি পেজ দেখার সময় একবার হয় । কিন্তু একটি বার বার হবার কোড আমার জানা নেই । তাই কেউ যদি জানেন তাহলে জানালে খুব খুশি হব। আপনি যদি লাইন হিসাবে করতে চান, মানে হলে প্রথমে এক লাইন , তারপরে আরেক লাইন, তারপরে আরেক লাইন তাহলে প্রথমি লাইন লিখার পরে এই <br/> কোড দিন। তারপরে লাইন শেষ হলে <br/> আবার এই কোড দিণ। আমার টি দেখুন ` আজমল'র ব্লগ-এ স্বাগতম<br/>আশা করি
আজমল'র ব্লগ-এ স্বাগতম এটি একটি লাইন। তারপরে নিচে থেকে শুরু হবে `আশা করি' এই লাইনটি। আশা করি বুঝতে পেরেছেণ।
প্রথমে ব্লগ এ লগ ইন করুন। তারপরে ডিজাইনে ক্লিক করুন। তারপরে নিচের ছবির মত এড এ গেজেট এ ক্লিক করুন
তারপরে একটি এড এ গেজেট নামে বক্স আসলে সেখান থেকে আপনাকে এইজটিএমএল/জাভা ইস্ক্রিপ্ট এ ক্লিক করুণ। আমার ছবিতে দেয়া নীল বর্ডার দেখুন-
এবার প্লাস দেয়া চিহ্ন তে ক্লিক করুন। তাহলে একটি বক্স আসবে । টাইটেল লিখা বক্সে কিছূ লিখার প্রয়োজন নেই। কন্টেন বক্সে নিচের কোড লিখুন এবং সেভ করুন। তারপরে উপরের সেভ এ ক্লিক করে প্রিভিউ দেখুন।
<script src="js/button.js" type="text/javascript"></script>
<script language="JavaScript">
<!--
var text="আজমল'র ব্লগ-এ স্বাগতম<br/>আশা করি এই সাইটের মাধ্যমে আপনি অনেক কিছু শিখতে পারবেন নিয়মিত ব্রাইজ করুন। এই সাইটের মেম্বার হলে আপনি সকল টপিক ই-মেইলের মাধ্যমে পেয়ে যাবেন। যে টপিকটি বুঝতে সমস্যা হবে, তার নিচে মন্তব্য করে জানান। অথবা আমাকে ই-মেইল করে জানান। আমি অবশ্য সেই সমস্যার সমাধান করার চেষ্টা করবো ইনশাআল্লাহ।<br />E-mail: kabbokatha08@gmail.com. Mobile: 019 1471 8299<br />";
var delay=50;
var currentChar=1;
var destination="[not defined]";
function type()
{
if (document.getElementById)
{
var dest=document.getElementById(destination);
if (dest)// && dest.innerHTML)
{
dest.innerHTML=text.substr(0, currentChar);
//dest.innerHTML+=text[currentChar-1];
currentChar++
if (currentChar>text.length)
{
currentChar=1;
xx = document.getElementById(destination).innerHTML
document.getElementById(destination).innerHTML=xx + "<br />"
}
else
{
setTimeout("type()", delay);
}
}
}
}
function startTyping(textParam, delayParam, destinationParam)
{
text=textParam;
delay=delayParam;
currentChar=0;
destination=destinationParam;
type();
}
//-->
</script>
<script type="text/javascript">
window.onload = function () {
startTyping(text, 60, "message");
}
</script>
<style type="text/css">
#message {
width:100%;
margin:0px auto;
font-family:"Courier New", Courier, monospace;
padding:2px;
height:100px;
color:#FF00FF;
text-align:left;
margin-top:10px;
}
</style>
<div id="container">
<div id="warper">
<div class="warper-main">
<div id="body-main">
<div class="body-top-box">
<div id="message" style="width: 200; height: 80">
</div></div>
</div>
</div>
</div>
</div>
কিন্তু একটি সমস্যা হলো তা এটি পেজ দেখার সময় একবার হয় । কিন্তু একটি বার বার হবার কোড আমার জানা নেই । তাই কেউ যদি জানেন তাহলে জানালে খুব খুশি হব। আপনি যদি লাইন হিসাবে করতে চান, মানে হলে প্রথমে এক লাইন , তারপরে আরেক লাইন, তারপরে আরেক লাইন তাহলে প্রথমি লাইন লিখার পরে এই <br/> কোড দিন। তারপরে লাইন শেষ হলে <br/> আবার এই কোড দিণ। আমার টি দেখুন ` আজমল'র ব্লগ-এ স্বাগতম<br/>আশা করি
আজমল'র ব্লগ-এ স্বাগতম এটি একটি লাইন। তারপরে নিচে থেকে শুরু হবে `আশা করি' এই লাইনটি। আশা করি বুঝতে পেরেছেণ।
আপনার মন্তব্য ও চাওয়া-পাওয়া লিখুন অথবা পোষ্টের নাম উল্লেখ করে ই-মেইল করুন-
kabbokatha08@gmail.com