UPDATED: JULY 26, 2016 – ARTICLE: EXPANDING MESSAGE
Category: Web Design & Development
Are you creating a website? Use our expanding message script an have a expanding message across the top of your page that starts small and slowly expands to the set size. After a few seconds your expanding message disappears, great to welcome visitors or you can have a nice welcome message on one of your pages.
See the demo on this page there is a expanding message that welcomes you and then after a few seconds it disappears. This can be used for anything that you would like to bring to the attention of visitors that visit a page.
The idea behind expanding message script is actually quite simple, by using dynamic content and font size manipulation, the text that appears to “zoom-in” and expands, by continuously refreshing the text so it gets larger and larger all the time until it reaches the set size. After a while the message will disappear.
How To Edit The Expanding Message Script
Change the message text colour look for the below code and change color:#0000FF
<body onload="position_at_top();expand()"> <div style="position:absolute; color:#0000FF"id="message"></div>
Change the display message remove USE THE EXPANDING MESSAGE ON YOUR SITE and replace with your message
//Change the message below var themessage="<strong>USE THE EXPANDING MESSAGE ON YOUR SITE</strong>"
Change the font size here - if (fontsize>40){ - change 40 higher bigger
How long do you want the message displayed? you can change the displayed time here setTimeout("expand()",500) change 500 if you want more time increase less time decrease.
Get Your Expanding Message Copy The Below Code
<body onload="position_at_top();expand()">
<div style="position:absolute; color:#0000FF"id="message"></div>
<script>
//This script created by Michael John
//Visit www.2createawebsites.com to get it!
//Change the message below
var themessage="<strong>USE THE EXPANDING MESSAGE ON YOUR SITE</strong>"
var fontsize=10
//Below determines how long the message will appear before disappearing. 3000=3 seconds
var appearfor=12000
function position_at_top(){
if (document.layers)
document.message.top=pageYOffset
else if (document.all){
message.innerHTML='<div align=center><font face="Arial">'+themessage+'</font></div>'
setTimeout("message.style.top=document.body.scrollTop+10; message.style.left=document.body.scrollLeft+10",100 )
}
else if (document.getElementById){
document.getElementById("message").innerHTML='<div align=center><font face="Arial">'+themessage+'</font></div>'
document.getElementById("message").style.top=pageYOffset
}
}
function expand(){
if (document.layers){
document.message.document.write('<div align=center style="font-size:'+fontsize+'px"><font face="Arial">'+themessage+'</font></div>')
document.message.document.close()
}
else if (document.all)
message.style.fontSize=fontsize+'px'
else if (document.getElementById)
document.getElementById("message").style.fontSize=fontsize+'px'
fontsize+=5
if (fontsize>40){
if (document.layers)
setTimeout("document.message.visibility='hide'",appearfor)
else if (document.all)
setTimeout("message.style.visibility='hidden'",appearfor)
else if (document.getElementById)
setTimeout("document.getElementById('message').style.visibility='hidden'",appearfor)
return
}
else
setTimeout("expand()",500)
}
</script>
Tags: expanding message, message
ARTICLE: EXPANDING MESSAGE WAS FIRST PUBLISHED: DECEMBER 14, 2013
Build your own website and sell stuff. Add as many products as you want and it won't cost you any extra.
Get super fast hosting
Free domain registration
Outstanding reliability
Free shopping basket
Easy to use site builder
Try creating your website free for 30 days. No credit card required, click the below link.
Free domain included or add a domain you own - Install WordPress in a few clicks - Great support team.
Get a Website that Works. It's quick and easy. No experience necessary.
Sign up today and get 20 percent off your hosting.
