This script will allow you to turn any page into a splash page, a second page is not necessary, the code will hide the orginal pages contents and display the splash/intro, once done or the person has click on Enter the script will display the orginal pages content. 1. Main Script Download the splash script, Click Here (right click and save as), and upload it to the documents on your site. Modify the main script below to include the necessary statements, to add statement simply copy the statements below and paste as necessary where indicated. Paste the main script in the HTML module. Main Script: <script type="text/javascript" src="/documents/oswcsplash.jsx" defer="defer"> </script> <script type="text/javascript"> window.onload = function(){
/* Statements go here */
} </script> Example script with statment to use flash: <script type="text/javascript" src="/documents/oswcsplash.jsx" defer="defer"> </script> <script type="text/javascript"> window.onload = function(){
var obj = OSWC_splashPage;
obj.splashContents = obj.useFlash('/Documents/flash.swf', '100%', '200px', 'Enter Site >> ;');
obj.init();
} </script> 2. Default Implementation
The default implementation uses the page's title as description for the splash content.
The number in Bold is an optional Integer specifying the time frame/interval in seconds
To wait until automatically stopping the splash show. You don't need both statement just one or the other.
Statements:
------------------------------------------------------------------------------------------------
OSWC_splashPage.init(30); /* With time frame */
OSWC_splashPage.init(); /* Without time frame */
------------------------------------------------------------------------------------------------
3. Custom Implementation
If you don't like the default implementation, you can use your own HTML as the splash page contents.
Insert the special keyword @stopSplash in the element (Image, Button, Etc...) that will stop the splash show when clicked.
The script will then replace that keyword with the code necessary to accomplish the mentioned action (Stop the splash show).
It will also insert a style declaration making the cursor a pointer when it reaches this element (style="cursor: pointer").
To be more specific, it will insert a onclick event and a style attribute/declaration.
Statement:
------------------------------------------------------------------------------------------------
var myCustom = '<h1>Header</h1>' + 'Frist line of text.<br />' + 'Second line of text.<br /><br />' + '<input type="button" value="Enter Site >>" @stopSplash />'
OSWC_splashPage.splashContents = myCustom;
OSWC_splashPage.init();
------------------------------------------------------------------------------------------------
4. Using Flash
With the helper functions created, It's fairly easy to implement flash in the splash page,
Of course, you can write the flash code yourself in a variable, then use it as the splash page contents.
This function get 4 params from you, flash file URL, width, height, button caption.
The width and height must be within quotes '' and you must specify the type you're using (px,%) - (pixels, percent).
If using numbers (doesn't apply to 'auto'), e.g., '150px' , '100%' , 'auto'.
The button caption is optional, (default 'Skip >>'), This button will be used to skip/stop the splash show,
And will be inserted below the flash. I have used the var obj as a reference to OSWC_splashPage, to make things shorter.
You can use the normal OSWC_splashPage method if you want.
Statement:
------------------------------------------------------------------------------------------------
var obj = OSWC_splashPage;
obj.splashContents = obj.useFlash('/Documents/flash.swf', '100%', '200px', 'Enter Site >> ;');
obj.init();
------------------------------------------------------------------------------------------------
5. Using I Frame
I Frame is very useful if your splash page contents are long/complex.
Just write/design your splash page in any HTML Editor, upload it to your docs folder, and use this I Frame method.
Same as the above method, this function requires 4 params, File to load, width, height, button caption.
The width and height must be within quotes '' and you must specify the type you're using (px,%) - (pixels, percent).
If using numbers (doesn't apply to 'auto'), e.g., '150px' , '100%' , 'auto'.
The button caption is optional, (default 'Skip >>'), This button will be used to skip/stop the splash show,
Statment:
------------------------------------------------------------------------------------------------
var obj = OSWC_splashPage;
obj.splashContents = obj.useIframe('/Documents/file.htm', '100%', '200px', 'Enter Site >> ');
obj.init();
------------------------------------------------------------------------------------------------
6. Further Moods
You can tune/modify/tweak some others things regarding the splash page styling/interface.
Statment:
------------------------------------------------------------------------------------------------
var obj = OSWC_splashPage;
obj.splash_top = 100; /* Top position of the splash contents */
obj.splash_align = 'center'; /* Alignment of the splash contents "left", "center", "right". Default is "center" */
------------------------------------------------------------------------------------------------
|