PDA

View Full Version : correct way to display a flash file in a browser

crmpicco
04-07-2006, 04:06 PM
<OBJECT codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" WIDTH="200" HEIGHT="100" id="picco">
<EMBED src="picco.swf" bgcolor=#333399 WIDTH="200" HEIGHT="100" NAME="picco" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED>
</OBJECT>

is this the correct way to display a flash file in a browser?
chilipie
04-07-2006, 05:03 PM
This will validate, your method won't :)
<object type="application/x-shockwave-flash" data="file.swf">
<param name="movie" value="file.swf" />
<img src="alternate-image.gif" alt="" />
</object>
chud_wallice
04-07-2006, 07:22 PM
There is a nice article on a list apart

http://www.alistapart.com/articles/flashsatay/
crmpicco
04-10-2006, 01:11 PM
<div align="center">
<OBJECT codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" WIDTH="500" HEIGHT="500" id="oPicco" onClick="javascript: alert('hello');">
<EMBED src="picco/picco.swf" bgcolor="#333399" WIDTH="500" HEIGHT="500" NAME="volaro" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED>
</OBJECT>
<br /><br />
<font class="font_Empowered">empowered By Picco &trade;</font>
</div>


Why can't I have an onClick event when i click the flash .swf file in my html page?

Picco
_Aerospace_Eng_
04-10-2006, 01:27 PM
Hmm I've never had to use onclick in the object tag mainly because you can use getURL in the actionscript for the flash object. Do you have the fla file? onActivate seems to work in IE but thats not valid.
crmpicco
04-10-2006, 01:54 PM
onActivate would do, but how do i use it? no, sorry i dont have the .fla file....
_Aerospace_Eng_
04-10-2006, 01:55 PM
Instead of onclick use onActivate but again this is IE only.
crmpicco
04-10-2006, 01:58 PM
<OBJECT codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" WIDTH="500" HEIGHT="500" id="picco" onActivate="javascript: alert('hello');">
<EMBED src="picco/picco.swf" bgcolor="#333399" WIDTH="500" HEIGHT="500" NAME="picco" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED>
</OBJECT>


this doesnt work, i dont get an alert through javascript.?
_Aerospace_Eng_
04-10-2006, 02:03 PM
Post a link to your flash file and get rid of javascript: its not needed. For a cross browser solution you can put a link on top of the flash. This is possible by using the param wmode.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
#flashcontain {
width:500px;
height:500px;
position:relative;
margin:40px auto;
}
#flashcontain a {
display:block;
position:absolute;
left:0;
top:0;
z-index:100;
width:500px;
height:500px;
}
#flashcontain object {
position:relative;
z-index:0;
}
</style>
</head>

<body>
<div id="flashcontain"><a href="http://www.google.com"></a>
<object type="application/x-shockwave-flash" width="500" height="500" data="picco/picco.swf">
<param name="movie" value="picco/picco.swf" />
<param name="wmode" value="transparent" />
</object>
</div>
</body>
</html>
crmpicco
04-10-2006, 02:04 PM
sorry this is all i can show you, its not on a server:


<OBJECT codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" WIDTH="500" HEIGHT="500" id="picco" onActivate="javascript: alert('hello');">
<EMBED src="picco/picco.swf" bgcolor="#333399" WIDTH="500" HEIGHT="500" NAME="picco" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer"></EMBED>
</OBJECT>


can i redirect another way? (without using javascript?)
_Aerospace_Eng_
04-10-2006, 02:05 PM
I just edited my post, and its not too hard to get a free web host temporarily.
crmpicco
04-10-2006, 02:11 PM
thanks for that! but it only works in FF, doesnt seem to work in IE6/7
crmpicco
04-10-2006, 02:16 PM
again, it only works on FF, no redirect no alert in IE6/7??
crmpicco
04-10-2006, 02:21 PM
i have tested it in IE6 and IE7, when I mouseover it the window status, in the bottom left-hand corner, says www.google.com. But when i click it - NOTHING!!!

Try it with a dummy .swf file on your localhost if you can.

Thanks for your help so far! Much Appreciated.

Nearly there though, eh?

:-)

Picco
_Aerospace_Eng_
04-10-2006, 02:38 PM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
#flashcontain {
width:500px;
height:500px;
position:relative;
margin:40px auto;
}
a img {
border:0;
}
#flashcontain a {
display:block;
position:absolute;
left:0;
top:0;
z-index:1;
width:500px;
height:500px;

}
#flashcontain object {
position:relative;
z-index:0;
}
</style>
</head>

<body>
<div id="flashcontain"><a href="http://www.google.com"><img src="dot_clear.gif" width="500" height="500" alt="" /></a>
<object type="application/x-shockwave-flash" width="500" height="500" data="picco/picco.swf">
<param name="movie" value="picco/picco.swf" />
<param name="wmode" value="transparent" />
</object>
</div>
</body>
</html>
crmpicco
04-10-2006, 03:50 PM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
#flashcontain {
width:500px;
height:500px;
position:relative;
margin:40px auto;
}
a img {
border:0;
}
#flashcontain a {
display:block;
position:absolute;
left:0;
top:0;
z-index:1;
width:500px;
height:500px;

}
#flashcontain object {
position:relative;
z-index:0;
}
</style>
</head>

<body>
<div id="flashcontain"><a href="http://www.google.com"><img src="dot_clear.gif" width="500" height="500" alt="" /></a>
<object type="application/x-shockwave-flash" width="500" height="500" data="picco.swf">
<param name="movie" value="picco.swf" />
<param name="wmode" value="transparent" />
</object>
</div>
</body>
</html>

Using the code above, after saving the dot_clear.gif into the same directory works, however, only on the second click of the object. Did you find that? Seems strange - do i need to wait on anything? Is there a way to make it redirect on one click????

Merci.

Picco
_Aerospace_Eng_
04-10-2006, 03:53 PM
It works fine for me on the first click. I tested in IE6 and FF1.0.5.1. If it doesn't work for you, now is the time you stop being lazy and upload your code and flash somewhere, its really not that hard.
crmpicco
04-10-2006, 03:58 PM
yeah, you are correct - on IE6 it works fine - i am running IE7b2 on my localhost here, when i checked it on another machine (thats running IE6) it worked fine on first click!

thanks for all your help Aerospace, unfortunately I am unauthorised to load up the .swf file to another server as it does not belong to me. Sorry.

Danke.

Picco
_Aerospace_Eng_
04-10-2006, 04:08 PM
I just ran it in IE7b2 and it works there as well.
crmpicco
04-10-2006, 04:22 PM
Did you have to do two clicks for running on IE7b2


<link rel="stylesheet" type="text/css" href="picco/style.css">
<style type="text/css">
#flashcontain {
width:500px;
height:500px;
position:relative;
margin:40px auto;
}
#flashcontain a {
display:block;
position:absolute;
left:0;
top:0;
z-index:1;
width:500px;
height:500px;
}
#flashcontain object {
position:relative;
z-index:0;
}
</style>


do you know if these can be put into my stylesheet in any way? i dropped them into the one shown in the code but it knocked out the alignment of the images.
_Aerospace_Eng_
04-10-2006, 04:25 PM
No I only had to click one time. I have no idea what the rest of the code looks like, you need to post it along with your CSS.