Search - Articles
DevASP.NET for ASP.NET, VB.NET, XML and C# (C-Sharp) Developers Tuesday, March 03, 2009
Dev Articles
Search Directory
ASP.NET
VB.Net
C-Sharp
SQL Server
 

How We can Blink the Text in our Web Application.

Author: DevASP
Download Source Code : 607_BlinkingText.zip

This article is about how you can blink the text in your web application.

Steps you will do.

 

Start visual studio and create a new web application. Open the HTML design of your web page and write the following JavaScript functions before closing the head tag.

 

  

<script language="JavaScript" type="text/javascript">

function lib_bwcheck(){

      this.ver=navigator.appVersion

      this.agent=navigator.userAgent

      this.dom=document.getElementById?1:0

      this.opera5=this.agent.indexOf("Opera 5")>-1

      this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom && !this.opera5)?1:0;

      this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom && !this.opera5)?1:0;

      this.ie4=(document.all && !this.dom && !this.opera5)?1:0;

      this.ie=this.ie4||this.ie5||this.ie6

      this.mac=this.agent.indexOf("Mac")>-1

      this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0;

      this.ns4=(document.layers && !this.dom)?1:0;

      this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5)

      return this

}

var bw=new lib_bwcheck()

 

 

nWorks = 0

nSlidespeed = 5   

nNewsheight = 80  

nBetweendelay = 1000        

nFont = 'arial,helvetiva'   

nFontsize = 22              

nFadespeed = 100

nColor=new Array('#FFFFFF', '#EEEEEE','#CCCCCC','#999999','#666666','#333333','#000000')

nNews=new Array()

nNews[0]=new Array()

nNews[0]["text"]="Enjoy this aplication!"

nNews[0]["link"]="/"

 

nNews[1]=new Array()

nNews[1]["text"]="Greate site of .NET articles"

nNews[1]["link"]="http://www.devasp.com"

nNews[2]=new Array()

nNews[2]["text"]="Search another site here!"

nNews[2]["link"]=http://www.devasp.net

 

function makeNewsObj(obj,nest,font,size,color,news,fadespeed,betweendelay,slidespeed,works,newsheight){

 

nest=(!nest) ? "":'document.'+nest+'.'

 

this.css=bw.dom? document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+"document.layers." +obj):0;

 

this.writeref=bw.dom? document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+"document.layers." +obj+".document"):0;

 

if(font){this.color=new Array(); this.color=eval(color); this.news=new Array(); this.news=eval(news)

 

this.font=font; this.size=size; this.speed=fadespeed; this.delay=betweendelay; this.newsheight=newsheight;

 

this.fadeIn=b_fadeIn;this.fadeOut=b_fadeOut; this.newsWrite=b_newsWrite; this.y=1

 

this.slideIn=b_slideIn; this.moveIt=b_moveIt; this.slideSpeed=slidespeed; this.works=works

 

if(bw.dom || bw.ie4){this.css.fontFamily=this.font; this.css.fontSize=this.size; this.css.color=this.color[0]}

      }

 

      this.obj = obj + "Object";    eval(this.obj + "=this"); return this

}

 

 

var px = bw.ns4||window.opera?"":"px";

function b_moveIt(x,y){this.x=x; this.y=y; this.css.left=this.x+px; this.css.top=this.y+px;}

function b_newsWrite(num,i){

if (bw.ns4){

this.writeref.write("<a href=\""+this.news[num]['link']+"\" target=\"myTarget\" style=\"text-decoration:none; font-size:"+this.size+"px\">"

+"<font face=\""+this.font+"\" color=\""+this.color[i]+"\">"+this.news[num]['text']+"</font></a>")

this.writeref.close()

}else this.writeref.innerHTML = '<a id="'+this.obj+'link' +'" target="myTarget"  style="text-decoration:none; font-size:'+this.size+'px; color:'+this.color[i]+'" href="'+this.news[num]['link']+'">'+this.news[num]['text']+'</a>'

}

 

function b_slideIn(num,i){

if (this.y>0){

if (i==0){this.moveIt(0,this.newsheight); this.newsWrite(num,this.color.length-1)}

this.moveIt(this.x,this.y-this.slideSpeed)

i ++

      setTimeout(this.obj+".slideIn("+num+","+i+");",50)

      }

else

setTimeout(this.obj+".fadeOut("+num+","+(this.color.length-1)+")",this.delay)

}

 

function b_fadeIn(num,i){

if (i<this.color.length){

      if (i==0 || bw.ns4) this.newsWrite(num,i)

      else{

      obj = bw.ie4?eval(this.obj+"link"):document.getElementById(this.obj+"link")

      obj.style.color = this.color[i]

      }

      i ++

      setTimeout(this.obj+".fadeIn("+num+","+i+")",this.speed)

      }

else

     setTimeout(this.obj+".fadeOut("+num+","+(this.color.length-1)+")",this.delay)

}

 

function b_fadeOut(num,i){

if (i>=0){

      if (i==0 || bw.ns4) this.newsWrite(num,i)

      else{

      obj = bw.ie4?eval(this.obj+"link"):document.getElementById(this.obj+"link")

      obj.style.color = this.color[i]

      }

      i --

setTimeout(this.obj+".fadeOut("+num+","+i+")",this.speed)

}

else{

      num ++

      if(num==this.news.length) num=0

      works = !this.works?0:this.works==1?1:Math.round(Math.random())

      if(works==0) setTimeout(this.obj+".fadeIn("+num+",0)",500)

      else if (works==1){this.y=1; setTimeout(this.obj+".slideIn("+num+",0)",500)

      }

}

}

 

function fadeInit(){

oNews = new makeNewsObj('divNews','divNewsCont',nFont,nFontsize,"nColor","nNews",nFadespeed,nBetweendelay,nSlidespeed,nWorks,nNewsheight)

oNewsCont = new makeNewsObj('divNewsCont')

works = !oNews.works?0:oNews.works==1?1:Math.round(Math.random())

if (works==0) oNews.fadeIn(0,0)

else if (works==1) oNews.slideIn(0,0)

oNewsCont.css.visibility = "visible"

}

 

 

if(bw.bw) onload = fadeInit

 

</script> 

 

 

 Now write the following HTML code.

 

 

<body marginleft="0" marginheight="0">

<div id="divNewsCont" style="WIDTH: 304px; HEIGHT: 80px">

<div id="divNews"></div>

</div>

</body> 

 

  

Note that you can also change the navigation URL, Text and their fading time.

  

Run your application.

Article Comments
Really,
This article is very good.
and very usefull to.
Thanks.

Posted on 11/18/2006 7:34:18 AM by Manish

Hi,
This article is very useful and nice coding.

Posted on 12/5/2006 4:58:35 AM by padma

Nice : Catchy

Posted on 12/8/2006 3:13:11 AM by Nayak

Article to Blink Text in Web Application

Posted on 4/29/2007 12:52:30 AM by Kiran

   
Add Article Comment:
Name :
Email Address :
   
Comments :
 
   
<< Creating a Popup Generator in a Web Application.

Disclaimer - Privacy
© 2002-2017 DevASP.net