GDev Resources.com - DHTML Flashloader Code

Top Navigation - Include

Home

Forums

Index

Terms

Developer Resources

DynamicScroller

Scripts

Javascripts
• Navigation
• Miscellaneous

DHTML
• Navigation
• Scrollers

Miscellaneous
Scripts-In-Action

MultiMedia

• Flash
• Music Loops

Recommends

• WebWiz Forums
• Macromedia HomeSite
• Jasc Paint Shop Pro
• Xara Products
• SWiSH

Shareware/Freeware

• Nonags
• Tucows
• ZDNet

Coding References

• ASCII Table
• CSS Property Table
• HTML Tag Attributes

Code Generators

• Cool Tools 1
• Cool Tools 2

DHTML Flashloader - Positional Flash IE4 Nav4 NS6
Created by: Ron Grafe
Version 1.0
Version Date: 3/14/2002

This DHTML script loads Flash movies into a layer and the movies are initialized and dynamically positioned when you mouseover a HTML tag. You can use any tag that supports an onmouseover ("mouseover") event to load the Flash movie. You can use this for Flash Advertisements, Flash Movies, Flash Navigation, ...any way you use Flash. Mouseover the links in the examples below.

You can customize the width, height, background color, font color, title background, title font color, and where the pop-up window is positioned relative to your cursor.
You can add rich text (HTML) along with your Flash file in the pop-up window or even add additional images along with it.
You can set number of seconds the window stays open in the onmouseout ("mouseout") event. The seconds are passed to a timer function.

Check out the Demo link to see some possibilities.

DEMO: DHTML Flashloader
ZIP FILE: DHTML Flashloader zip - all related files and instructions.

Step 1: Select, Copy and paste the following code into the "HEAD" section of your HTML Page. Then add elements in the "titleArray" and "linkArray" to define your content. Add your Flash OBJECT code to the linkArray.

SELECT ALL

var titleArray = new Array
titleArray[1]="<strong></strong>"
titleArray[2]="<strong></strong>"
titleArray[3]="<strong></strong>"
titleArray[4]="<strong></strong>"

//	PLACE ALL YOUR BOX CONTENT IN A NEW ARRAY ELEMENT - THIS IS WHERE YOU ADD YOUR .SWF HTML <OBJECT> CODE. 
//	MAKE SURE YOU USE A = ON THE FIRST LINE AND += AFTER THE FIRST LINE. 
//	CHANGE ALL DOUBLE QUOTES IN YOUR FLASH GENERATED CODE TO SINGLE QUOTES. 
//
//	KEEP ALL OF A TAG'S CODE ON ONE LINE (IF YOU BREAK IT UP IT CAUSES PROBLEMS IN NS4).
//
//	EXAMPLE:
//	DO THIS --- linkArray[7]+="<OBJECT classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000' codebase='http://active.macromedia.com/flash2/cabs/swflash.cab#version=4,0,0,0' ID=Thoughts WIDTH=150 HEIGHT=125>"
//
//	NOT THIS --	linkArray[7]+="<OBJECT classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000'"
//				linkArray[7]+="codebase='http://active.macromedia.com/flash2/cabs/swflash.cab#version=4,0,0,0'"
//				linkArray[7]+="ID=Thoughts WIDTH=150 HEIGHT=125>"

var linkArray = new Array
linkArray[1]="<html><head><title>Previewer</title></head><body marginheight='0' marginwidth='0' topmargin='0' leftmargin='0'>"
linkArray[1]+="<table width='' cellspacing='0' cellpadding='0'><tr><td width='' align='left'>"
linkArray[1]+=""
linkArray[1]+=""
linkArray[1]+=""
linkArray[1]+=""
linkArray[1]+=""
linkArray[1]+=""
linkArray[1]+=""
linkArray[1]+=""
linkArray[1]+="</td></tr></table>"
linkArray[1]+="</body></html>"

linkArray[2]="<html><head><title>Previewer</title></head><body marginheight='0' marginwidth='0' topmargin='0' leftmargin='0'>"
linkArray[2]+="<table width='' cellspacing='0' cellpadding='2'><tr><td width='' align='center'>"
linkArray[2]+=""
linkArray[2]+=""
linkArray[2]+=""
linkArray[2]+=""
linkArray[2]+=""
linkArray[2]+=""
linkArray[2]+=""
linkArray[2]+=""
linkArray[2]+=""
linkArray[2]+=""
linkArray[2]+=""
linkArray[2]+=""
linkArray[2]+="</td></tr></table>"
linkArray[2]+="</body></html>"

linkArray[3]="<html><head><title>Previewer</title></head><body marginheight='0' marginwidth='0' topmargin='0' leftmargin='0'>"
linkArray[3]+="<table width='' cellspacing='0' cellpadding='0'><tr><td width='' align='center'>"
linkArray[3]+=""
linkArray[3]+=""
linkArray[3]+=""
linkArray[3]+=""
linkArray[3]+=""
linkArray[3]+=""
linkArray[3]+=""
linkArray[3]+=""
linkArray[3]+=""
linkArray[3]+="</td></tr></table>"
linkArray[3]+="</body></html>"

linkArray[4]="<html><head><title>Previewer</title></head><body marginheight='0' marginwidth='0' topmargin='0' leftmargin='0'>"
linkArray[4]+="<table width='' cellspacing='0' cellpadding='0'><tr><td width='' align='center'>"
linkArray[4]+=""
linkArray[4]+=""
linkArray[4]+=""
linkArray[4]+=""
linkArray[4]+=""
linkArray[4]+=""
linkArray[4]+=""
linkArray[4]+=""
linkArray[4]+=""
linkArray[4]+="</td></tr></table>"
linkArray[4]+="</body></html>"

var thename
var theobj
var thetext
var winHeight
var winWidth
var boxPosition
var headerColor
var tableColor
var timerID
var seconds=0
var x=0
var y=0
var offsetx = 2
var offsety = 2

if(ns4) {
	document.captureEvents(Event.MOUSEMOVE | Event.DBLCLICK)
}
document.onmousemove=getXY
document.ondblclick=stopIt

function buildText(value,tcolor,bcolor) {
// CHANGE EACH ARRAY ELEMENT BELOW TO YOUR OWN CONTENT. MAKE SURE TO USE SINGLE QUOTES INSIDE DOUBLE QUOTES.
text="<table width='"+(winWidth-4)+"' height='"+(winHeight-4)+"' border='1' bgcolor='"+tableColor+"' cellspacing='1' cellpadding=1>"
text+="<tr><td width='"+(winWidth-4)+"' height='20' align='center' valign='middle' bgcolor='"+headerColor+"'>"
text+="<font face='Arial,Helvetica' color='"+tcolor+"' SIZE='-1'>"+titleArray[value]+"</font>"
text+="</td></tr>"
text+="<tr><td width='"+winWidth+"' align='center' valign='middle'>"
text+="<font face='Arial,Helvetica' color='"+bcolor+"' SIZE='-2'>"+linkArray[value]+"</font>"
text+="</td></tr></table>"
return text
}

function viewIt() {
		if(iens6) {
			theobj.style.visibility="visible"
		}
		if(ns4) {
			theobj.visibility = "visible"
		}
}

function stopIt() {
	if(iens6) {
		theobj.innerHTML = ""
		theobj.style.visibility="hidden"
	}
	if(ns4) {
		theobj.document.write("")
		theobj.document.close()
		theobj.visibility="hidden"
	}
}

function timer(sec) {
	seconds=parseInt(sec)
	if(seconds>0) {
		seconds--
		timerID=setTimeout("timer(seconds)",1000)
	}else{
		stopIt()
	}
}

Step 2: Select, Copy and paste the following code into the BODY section of your HTML page. Then use the appropriate code snippet in whatever tag you choose.

SELECT ALL

<layer name="nsviewer" bgcolor="#cccccc" width=0 height=0 style="border-width:thin;z-index:1"></layer>
<script language="JavaScript1.2">
if (iens6){
document.write("<div id='viewer' style='background-color:#cccccc;marginleft:0;visibility:hidden;position:absolute;width:0;height:0;z-index:1;overflow:hidden'></div>")
}
if (ns4){
	hideobj = eval("document.nsviewer")
	hideobj.visibility="hidden"
}
</script>

onmouseover="setObj(element,bWidth,bHeight,'bPosition','tBackColor','bBackColor','tFontColor','bFontColor')" onmouseout="timer(numSec)"

onClick="stopIt()"

Step 3: Place all of your Flash (.SWF) files and any other Flash related files into the same directory as your HTML page.

Site Generated and Maintained using Macromedia Homesite

• HtmlCodeTutorial.com
• DevGuru.com
• Builder.com
• WDVL.com
• WebDeveloper.com
• WebReference.com
• Pageresource.com
• W3C

Javascript Resources

• Website Abstraction
• JavaScript.com
• JavaScript Source

DHTML Resources

• Website Abstraction
• Dynamic Drive
• Jeff Rule's DHTML

Java Resources

• JavaBoutique.com
• Sun Download Center

ASP Resources

• ASP101
• LearnASP
• PowerASP
• ASPZone

ScriptKingdom.com
Script repository
and resource site

www.hotscripts.com