This is a very simple scroller script that can be added to any HTML page, to a sidebar.js or under your menu in the menu.js. This add-on has been tested and is compatible in IE, Netscape, Firefox and Opera browsers.
ADD-ON BUGS (Please Read):
You may encounter some problems in some templates with the "auto scrolling" add-on in IE due to bugs in this browser. In some cases the scroller will not work on your local hard drive but may work when uploaded. In some cases your template DOCTYPE may be the problem. Be aware Allwebco does NOT provide support for these errors. If this scroller works in your template in IE then it will cause no problems and will work in all other newer browsers.
The Examples >>>
On the right on this page are three examples. All examples are an embedded standard HTML page that uses an IFrame and Javascript to scroll. Example one is set to scroll through the page and then rescroll from the bottom. Example two is set to scroll through and then restart. Example three is like example one but is setup with an RSS type news feed. This feed is using Javascript instead of XML. This news feed can be added to any HTML website is available for free at worldpress.org. For more info please see adding news feeds.
Skip the steps and download:
In a rush? Just click below to download the embedded HTML page and code samples for this add-on. Refer back to this page for help.
Step #1 HTML code:
Select and copy the following code. Paste this into THE "MAIN" or "CONTENT" table on any of your HTML template pages.
FOR AN HTML PAGE:
If you use the code above you can float this with a DIV. Click here for details. NOTE: The samples in the download above on this page include DIV code.
Step #1 in a .js file:
Or... If you would like to globally add this to all your pages you can paste this into your sidebar.js or in your menu.js.
In a sidebar.js One option would be to add the code below just before the "SMALL PICTURE AREA" note. Make a copy of your sidebar.js for backup and try pasting in the code and test your pages in a web browser.
In a menu.js If you have a vertical menu style you can probably add this to your menu.js. Make a backup of your menu.js. Open the menu.js and try pasting the code below near the bottom of this file. Most likely you will add this just before some < /td>< /tr>< /table> or < /div> code. This may not work in some template models see the step above for HTML page options instead.
FOR A .JS FILE LIKE THE sidebar.js OR menu.js:
Step #2:
Download the embedded page "news_win.htm" and place this page in your main template folder with your other HTML pages.
Or...
Step #3:
Test your webpages. The scroller should now be working. Edit the "news_win.htm" to change your page text for the scroller.
Set speeds:
You can edit the "news_win.htm" to change speeds and starting pause time. These are variables near the bottom of this page. See the notes in this file in HTML source view.
News font colors:
You can edit the page font colors and sizes. This will be the CSS code near the top of the "news_win.htm".
News box, border and title colors:
The box colors and title color will be in the HTML code you added to your pages. Not in the "news_win.htm".
News box size:
Edit the IFrame height and width in the HTML code you added to your pages. If you change the size of the IFrame window edit the "frameheight" variable in the "news_win.htm" to match your new window size. The IFrame size and "frameheight" variable should match so the text re-scrolls from the bottom of the window. The height in the default code is 200.
Restart or scroll again option:
To have the scroller reload at the top for the second time through, change the "frameheight" to "2" and change the "nextdelay" to "1" or "2". If you are re-scrolling set the "nextdelay" to 0. See "Examples" on this support page.
Link targets:
The "news_win.htm" includes two target "_top" sample links. You can use this target or you can use a target="_blank" to target links outside the scroller window.
Multiple scrollers:
You can add as many scrollers to your HTML pages as you need. Use the code above in step #2. Edit the src="news_win.htm" to for example src="news_win2.htm" in one place. Make a copy of the src="news_win.htm" and name it src="news_win2.htm".
source: allwebco-templates.com
