DHTML script
 

SimplytheBest
Scripts

ASP scripts
PERL scripts
PHP scripts
JavaScripts & Ajax
Snippets
Online scripts

Ajax, DHTML
& JavaScripts

Animation
Background
Bookmarks
Buttons
Calculators
Cookies
Data handling
E-mail
Enhancements
Forms
Image rotation
Menus
Messages
Miscellaneous
Music
Password protection
Redirection
Scrollers
Tables
Time & date
Windows

Publishers
Add script
Account login
Publisher list



 

Home > Scripts > DHTML scripts & JavaScripts > Scrollers > Multiple content scroller script

 

Multiple content scroller script

AUTHOR: Martial Boissonneault
TYPE: Freeware
BROWSERS: IE 5+, IE 6+, NS 6+

This script allows you to scroll multiple content in one page. Using onMouseOver to scroll down and up, each content automatically scrolls to top on change. The scroll function doesn't scroll after the end of the text. You can include any HTML code inside the content area of each scrolling text. NS7+ may not properly show some images on the page with this script in place.


EXAMPLE

PlanMagic Business

Professional business planning software to provide you with trend setting templates and financial projections.

Program features:
  • easy-to-use browser interface
  • easy-to-follow comprehensive business guide
  • built-in marketing concept
  • clear goals and strategy settings
  • easy to use in known word processor formats
  • historic information
  • pre-defined spreadsheets with automatic calculations between sheets
  • assumptions sheet to enter variables such as tax rates, etc..
  • fully automated charts
  • complete financial data and automatic ratios
  • complete investment budget
  • capitalization and balance sheet projections
  • sales, profit & loss, cashflow projections
  • automatic completion of financials in sequence
  • advertising budget and personnel plan
  • quick one year projection
  • best case/worst case scenarios
  • product line and products per product line generator
Click here to know more

PlanMagic Marketing

The leading marketing planning software for the marketing professional.

Program features:
  • product line and products per product line generator
  • easy-to-follow marketing plan guide
  • detailed analysis of internal & external factors
  • detailed analysis of product mix, markets, competitors and customers
  • clear market, HRD research information
  • 20 conclusions compiled & ready to be printed
  • pre-defined action list
  • fully automated charts and ratios
  • comprehensive goals and strategy settings
  • pre-defined spreadsheets with automated charts
  • complete demographics and psychographics
  • target markets and product/market combinations definitions
  • marketing budget and budget comparison
  • information can be imported from and exported to other applications
  • and more..
Click here to know more

PlanMagic Finance Pro

Financial calculations and planning were never this easy, yet so complete.

Program features:
  • easy to use browser interface for the manual
  • easy to use in known spreadsheet format
  • product line and products per product line generator
  • pre-defined spreadsheets with automatic calculations between sheets
  • fully automated charts
  • complete financial data and automatic ratios
  • detailed capitalization and balance sheet
  • estimate sales incl. sales tax calculations
  • sales projections monthly and annual
  • profit & loss projections
  • cash flow projections
  • tautomatic completion of financials in sequence
  • automated balance sheet projections
  • advertising budget
  • and more..
Click here to know more

PlanMagic Hotel

It's the easiest to use Hotel business plan program available today. It provides you with trend setting templates and financial projections.

Program features:
  • easy-to-use browser interface
  • comprehensive hotel business guide
  • built-in marketing concept
  • clear goals and strategy settings
  • pre-defined spreadsheets with automatic calculations
  • fully automated charts
  • complete financial data and automatic ratios
  • complete investment budget
  • capitalization and balance sheet projections
  • sales, profit & loss, cash flow projections
  • advertising budget and personnel plan
  • and more...
Click here to know more

PlanMagic Restaurant

It's the easiest to use restaurant business plan program available today. It provides you with trend setting templates and financial projections.

Program features:
  • easy-to-use browser interface
  • comprehensive restaurant business guide
  • built-in marketing concept
  • clear goals and strategy settings
  • pre-defined spreadsheets with automatic calculations
  • fully automated charts
  • complete financial data and automatic ratios
  • complete investment budget
  • capitalization and balance sheet projections
  • sales, profit & loss, cash flow projections
  • advertising budget and personnel plan
  • and more...
Click here to know more


1) Insert this style command with the script in the <HEAD> section of the page.

then copy (CTRL-C) & paste (CTRL-V)

2) Insert the following HTML code in the <BODY> section where you want the content to appear in the page:

then copy (CTRL-C) & paste (CTRL-V)

3) Insert the onload event handler inside the <BODY> tag as follows:

<body onload="ScrollPageInit();", followed by other tags such as bgcolor, etc..

copy (CTRL-C) & paste (CTRL-V)

4) Define the style and the positioning of the links, the scroller box and the arrow images in the <STYLE> command section:

<style type="text/css">
body {width:100%; height:100%; margin:0px;}
#links {position:absolute; left:120px; top:280px;}
#up {position:absolute; left:600px; top:282px; cursor:pointer;}
#down {position:absolute; left:600px; top:552px; cursor:pointer;}
#cont {position:relative; left:170px; top:0px; width:300px; height:300px; border:1px solid #006699; overflow:hidden;}
.txt {position:absolute; left:0px; top:0px; width:290px; font-family:verdana,arial,helvetica,sans-serif; font-size:11px; text-align:left; padding:5px; visibility:hidden;}
</style>

5) Define the path to the arrow images, the links and the content of each page in this section of the HTML code:

<!-- Scroller start -->
<img src="scroller_images/up_over.gif" style="display:none;">
<img src="scroller_images/down_over.gif" style="display:none;">
<img id="up" src="scroller_images/up_out.gif" width="22" height="26" border="0" alt="" name="b1" onmouseover="ScrollUp(5); this.src='scroller_images/up_over.gif';" onmouseout="ScrollStop(); this.src='scroller_images/up_out.gif'" />
<img id="down" src="scroller_images/down_out.gif" width="22" height="26" border="0" alt="" name="b2" onmouseover="ScrollDown(5); this.src='scroller_images/down_over.gif'" onmouseout="ScrollStop(); this.src='scroller_images/down_out.gif'"/>

<div id="links">
<a href="#" onclick="ChangePage('page1')">PlanMagic Business</a><br>
<a href="#" onclick="ChangePage('page2')">PlanMagic Marketing</a><br>
<a href="#" onclick="ChangePage('page3')">PlanMagic Finance Pro</a>
</div> 

<div id="cont">
<div id="page1" class="txt">
<b><a href="http://planmagic.com/business_planning.html">PlanMagic Business</a></b><br>
<br>
Professional business planning software.<br>
<br>
Program features:<br>
<ul>
<li>easy-to-use browser interface</li>
<li>easy-to-follow comprehensive business guide</li>
<li>built-in marketing concept</li>
<li>clear goals and strategy settings</li>
<li>easy to use in known word processor formats</li>
</ul>
<br>
</div>

<div id="page2" class="txt">
and so forth...

You can download this ZIP file with the arrow images used in this example if you like.

For more information you can also visit the getElementById.com web site.


[BACK] [TOP]

 


Copyright © 1997-2009 SimplytheBest Inc. Terms of Use and Legal Disclaimer.
All copyrights are acknowledged. All rights reserved.