To include this FX in your document, after you have downloaded the demo
zip file, you need to put the the following in the HEAD section of your
document
<!-- *** BEGIN CUT - Start Code *** -->
<!-- (* Another free JavaScript © from JavaScript-FX.com *) -->
<SCRIPT LANGUAGE="javascript" SRC="javascript/JSFX_Layer.js"></SCRIPT>
<SCRIPT LANGUAGE="javascript" SRC="javascript/JSFX_VerticalScroller.js"></SCRIPT>
<SCRIPT LANGUAGE="javascript">
<!--
var myScroller = new JSFX.VerticalScroller();
myScroller.setStyle("font-family: Verdana, Arial,
Helvetica; font-size:12px; color:#000000");
myScroller.setBgImage("images/bg2.jpg");
myScroller.addMessage("This is a news scroller.");
myScroller.addMessage("This is a message in the news
scroller.");
//-->
</SCRIPT>
<SCRIPT LANGUAGE="javascript" TYPE="text/javascript">
<!--
function JSFX_StartEffects()
{
myScroller.start();
}
//-->
</SCRIPT>
<!-- *** END CUT - End Code *** -->
Put the following in the BODY TAG of your document
<BODY onLoad="JSFX_StartEffects()">
In the document body, where you want the scroller, place the following
HTML
<SCRIPT LANGUAGE="javascript" TYPE="text/javascript">
myScroller.toHtml(200,80);
</SCRIPT>
Where.
Param1: 200 - The width of the scroller
Param2: 80 - The height of the scroller
For example. To place the scroller in a centered table
<TABLE width="200" cellspacing="0" cellpadding="0" border="4" align="center">
<TR>
<TD><script language="JavaScript">
document.write(myNews1.toHtml(200,80));
</script></TD>
</TR>
</TABLE>
var myScroller = new
JSFX.VerticalScroller();
This creates a vertical scroller called myScroller.
You can call it what you want and you can create multiple scrollers. E.g.
var myScroller1 = new JSFX.VerticalScroller();
var myScroller2 = new JSFX.VerticalScroller();
myScroller.setStyle("...Valid
CSS Style ....");
This allows you to set the text style/color/size using any valid CSS style
attributes.
myScroller.setBgImage("images/bg2.jpg");
This sets the background image for the scroller. The image is tiled
across the width & height of the scroller.
myScroller.addMessage("...Valid
HTML here ...");
Use this method to add your messages to the news scroller. E.G.
myScroller.addMessage("This
is message One");
myScroller.addMessage("<b>This
message is in BOLD</b>");
Also See...
Using External ".js"
Files
Combining Multiple Scripts.
|