I found this simple javascript from a blog that will animate our blog's title and I am sharing this to you. I have added some tips on the script to help you modify the code. This code is my modified version. The one I found have 2 declared title variables only and I changed it into 5 for my other blog, A Piece of Idea. I have also changed the variable names (a1 to title1), and function names (b1 to displaytitle1) using english words to easily understand the code.
Later, I will teach you how to install and modify the code but you must first take a grip of what will happen if you install the code to your blog. Visit my other blog for a demo and view the page source to locate the location of the code.
Visit my other blog for a demo.
The Javascript Code:
<script LANGUAGE="JavaScript">
/* Declare your title here */
var title1 = "A Piece of Idea";
var title2 = "Thoughts of a Man!";
var title3 = "Thoughts of a Blogger!";
var title4 = "Thoughts of a Webmaster!";
var title5 = "And thoughts of a Friend!";
/* Set Deley Time */
var delay = 1000;
var firsttitledelay = 2000;
/*Call Function displaytitle1()*/
displaytitle1();
/* Functions */
function displaytitle5()
{
setTimeout("displaytitle1()",delay);
document.title = (title5);
}
function displaytitle4()
{
setTimeout("displaytitle5()",delay);
document.title = (title4);
}
function displaytitle3()
{
setTimeout("displaytitle4()",delay);
document.title = (title3);
}
function displaytitle2()
{
setTimeout("displaytitle3()",delay);
document.title = (title2);
}
function displaytitle1()
{
setTimeout("displaytitle2()",firsttitledelay);
document.title = (title1);
}
</Script>
Where to put the code?
If you visited the demo and viewed its page source, you will have an idea on where to put the code but if not, here’s what to do.
- Insert the code on top of <TITLE> tag but in between <HEAD> and </HEAD> tags.
How to add another title or the sixth title?
Modifying the code is not that difficult. All you need to do is to add or declare another variable title. In this case, add the title variable title6 below the title variable title5.
- var title5 = "And thoughts of a Friend!";
- var title6 = "Your Sixth Title Here!";
If you add another title, you must not forget to add another function that calls the title. The function itself, when called, displays the title variable you declared. You must add another function above the first function. In this case, add function displaytitle6 above function displaytitle5. (Just copy function displaytitle5 and paste it above the same function.) Then change “setTimeout("displaytitle1()",delay);” of function displaytitle5 to “setTimeout("displaytitle6()",delay);” so that the latter function will next call displaytitle6 function; and change “document.title = (title5);” of function displaytitle6 to “document.title = (title6);” so that the latter function will display variable title6.
Here is what you should see:
function displaytitle6()
{
setTimeout("displaytitle1()",delay);
document.title = (title6);
}
function displaytitle5()
{
setTimeout("displaytitle6()",delay);
document.title = (title5);
}
That’s all folks. I hope you like it and learned a lot from it. Please bear with my explanation because I am not a good teacher. Comment here if you have some inquiries.
Thank you so much and have a great day!
3 comments:
Hi Write Shy, thanks for the visit and the messages in it. Got a tag for you.CHECK IT.
Very interesting! I know nothing about Java, so analyzing this is got me curious.
Do you know where code is available for a menu bar at the top of a blogger page??
Happy week!
Speedy
u got great site..very informative...pls let me know when ur done adding..will add u 2moro..got migraine now..thanks in advance
http://gemstarlightexpress.blogspot.com
http://www.rubybenz.com
http://www.theworldwidewebaddict.rubybenz.com
http://www.mydailynourishment.rubybenz.com
http://myeurotravelandadventures.blogspot.com
Post a Comment