Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

chiefroastbeef

macrumors 6502a
Original poster
May 26, 2008
909
0
Dallas, Texas/ Hong Kong
Hello guys,

I've searched all over google, took a better part of the century to read through half of them, but still haven't solved my seemingly simple problem.

I used Fireworks to do my design layout, and flash to make the short video clip. I centered both the flash and the fireworks html layout in Dreamweaver, and tested it with firefox. Everything seems fine and lines up well with the default size Firefox browser that pops up. Picture below:
dsc00031vv4.jpg


However, when I drag the lower right corner resizing tab, the Fireworks layout moves with the resizing, but the flash is locked in place on the screen no matter how I resize the browser or move the broswer. Picture below:
dsc0005vg0.jpg


The flash is on a separate layer, the Fireworks layout is a .htm file.

Any suggestions from the veterans? I am quite puzzled at this problem, it seems simple but I cannot figure it out, even with two "Dummies" books at my side, and hours of searching "flash align dreamweaver."

Thanks in advance!


Here is the code to the flash(at least I think it is):

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="700" height="400" title="Flash Intro">
<param name="movie" value="../../homepage.swf">
<param name="quality" value="high"><param name="SCALE" value="exactfit">
<embed src="../../homepage.swf" width="700" height="400" scale="exactfit" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></embed>
</object>
 
Need to see link or at least relevant DHTML and CSS (not just the embed). I mention DHTML since you said you used a layer which can float independently of other elements on the page.

BTW, you do not need a layer to display a Flash file, so for now the advice is remove the layering technique and simply embed the Flash in a DIV positioned just where you want it. It with then become part of the flow as you resize the browser and move along with the other elements.

-jim
 
Jim,

Thanks again for you help brother! Should I start paying ya for your help?:D

Can I really add <div> tags inside a Fireworks HTML image? My Fireworks layout inside DW are split into a couple of images, and when I try to drag the Flash onto the Fireworks image layout without a layer, the images split apart, and I can this ruined puzzle kind of thing.

I know absolutely no code, how should I go about doing it? I'll look for tutorials as well.

Thanks again Jim!
 
Here is the code:

<!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" media="screen">
@import url("Homefireworks/homebanner.css");
@import url("Homefireworks/homebanner.css");
@import url("Homefireworks/homebanner.css");
@import url("Homefireworks/homebanner.css");
@import url("Homefireworks/homebanner.css");




@import url("Homefireworks/homebanner.css");
#Layer1 {
position:absolute;
left:268px;
top:-336px;
width:599px;
height:351px;
z-index:1;
}
#Layer2 {
position:absolute;
left:0px;
top:0px;
width:165px;
height:457px;
z-index:1;
}
#homeflash {
position:absolute;
left:356px;
top:284px;
width:581px;
height:317px;
z-index:1;
}

#Layer1 {
position:absolute;
left:227px;
top:312px;
width:578px;
height:393px;
z-index:1;
}

#Layer1 {
position:absolute;
left:227px;
top:312px;
width:578px;
height:393px;
z-index:1;
}






</style>
<script language="JavaScript1.2" type="text/javascript" src="Homefireworks/mm_css_menu.js"></script>
<script type="text/JavaScript">
<!--
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers.document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_nbGroup(event, grpName) { //v6.0
var i,img,nbArr,args=MM_nbGroup.arguments;
if (event == "init" && args.length > 2) {
if ((img = MM_findObj(args[2])) != null && !img.MM_init) {
img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;
if ((nbArr = document[grpName]) == null) nbArr = document[grpName] = new Array();
nbArr[nbArr.length] = img;
for (i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args)) != null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = img.MM_dn = args[i+1];
nbArr[nbArr.length] = img;
} }
} else if (event == "over") {
document.MM_nbOver = nbArr = new Array();
for (i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args)) != null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = (img.MM_dn && args[i+2]) ? args[i+2] : ((args[i+1])? args[i+1] : img.MM_up);
nbArr[nbArr.length] = img;
}
} else if (event == "out" ) {
for (i=0; i < document.MM_nbOver.length; i++) {
img = document.MM_nbOver; img.src = (img.MM_dn) ? img.MM_dn : img.MM_up; }
} else if (event == "down") {
nbArr = document[grpName];
if (nbArr)
for (i=0; i < nbArr.length; i++) { img=nbArr; img.src = img.MM_up; img.MM_dn = 0; }
document[grpName] = nbArr = new Array();
for (i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args)) != null) {
if (!img.MM_up) img.MM_up = img.src;
img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;
nbArr[nbArr.length] = img;
} }
}

function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a)&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
</head>

<body onload="MM_preloadImages('Homefireworks/CHUhomebtn_f3.jpg','Homefireworks/CHUhomebtn_f2.jpg','Homefireworks/aboutusbtn_f3.jpg','Homefireworks/aboutusbtn_f2.jpg','Homefireworks/Photosbtn_f3.jpg','Homefireworks/Photosbtn_f2.jpg','Homefireworks/Writingsbtn_f3.jpg','Homefireworks/Writingsbtn_f2.jpg','Homefireworks/Donatebtn_f3.jpg','Homefireworks/Donatebtn_f2.jpg','Homefireworks/homebanner_r4_c5_f2.jpg','Homefireworks/homebanner_r4_c11_f2.jpg','Homefireworks/homebanner_r5_c2_f2.jpg')">
<div id="homeflash"></div>
<div align="center"></div>
<div id="Layer1">

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="700" height="400" title="Flash Intro">
<param name="movie" value="../homepage.swf" />
<param name="quality" value="high" />
<embed src="../homepage.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="700" height="400"></embed>
</object>
</div>
<div align="center"></div>
<div id="layer"></div>
<div align="center">
<div id="FWTableContainer58320594">
<table border="0" cellpadding="0" cellspacing="0" width="802">
<!-- fwtable fwsrc="homebanner" fwbase="homebanner.jpg" fwstyle="Dreamweaver" fwdocid = "58320594" fwnested="0" -->
<tr>
<td><img src="Homefireworks/spacer.gif" width="18" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="164" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="76" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="23" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="25" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="2" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="118" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="1" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="94" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="23" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="2" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="1" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="119" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="1" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="117" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="1" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="17" height="1" border="0" alt="" /></td>
<td><img src="Homefireworks/spacer.gif" width="1" height="1" border="0" alt="" /></td>
</tr>
<tr>
<td colspan="17"><img src="Homefireworks/homebanner_r1_c1.jpg" alt="" name="homebanner_r1_c1" width="802" height="17" border="0" id="homebanner_r1_c1" /></td>
<td><img src="Homefireworks/spacer.gif" width="1" height="17" border="0" alt="" /></td>
</tr>
<tr>
<td rowspan="3" colspan="2"><img src="Homefireworks/homebanner_r2_c1.jpg" alt="" name="homebanner_r2_c1" width="182" height="713" border="0" id="homebanner_r2_c1" /></td>
<td colspan="3"><a href="javascript:;" target="_top" onclick="MM_nbGroup('down','navbar1','CHUhomebtn','Homefireworks/CHUhomebtn_f3.jpg',1);" onmouseover="MM_nbGroup('over','CHUhomebtn','Homefireworks/CHUhomebtn_f2.jpg','Homefireworks/CHUhomebtn_f3.jpg',1);" onmouseout="MM_nbGroup('out');"><img src="Homefireworks/CHUhomebtn.jpg" alt="" name="CHUhomebtn" width="124" height="23" border="0" id="CHUhomebtn" /></a></td>
<td rowspan="2"><img src="Homefireworks/homebanner_r2_c6.jpg" alt="" name="homebanner_r2_c6" width="2" height="712" border="0" id="homebanner_r2_c6" /></td>
<td><a href="javascript:;" target="_top" onclick="MM_nbGroup('down','navbar1','aboutusbtn','Homefireworks/aboutusbtn_f3.jpg',1);" onmouseover="MM_nbGroup('over','aboutusbtn','Homefireworks/aboutusbtn_f2.jpg','Homefireworks/aboutusbtn_f3.jpg',1);" onmouseout="MM_nbGroup('out');"><img src="Homefireworks/aboutusbtn.jpg" alt="" name="aboutusbtn" width="118" height="23" border="0" id="aboutusbtn" /></a></td>
<td rowspan="2"><img src="Homefireworks/homebanner_r2_c8.jpg" alt="" name="homebanner_r2_c8" width="1" height="712" border="0" id="homebanner_r2_c8" /></td>
<td colspan="3"><a href="javascript:;" target="_top" onclick="MM_nbGroup('down','navbar1','Photosbtn','Homefireworks/Photosbtn_f3.jpg',1);" onmouseover="MM_menuShowMenu('MMMenuContainer0820183802_0', 'MMMenu0820183802_0',0,23,'Photosbtn');MM_nbGroup('over','Photosbtn','Homefireworks/Photosbtn_f2.jpg','Homefireworks/Photosbtn_f3.jpg',1);" onmouseout="MM_nbGroup('out');MM_menuStartTimeout(1000);"><img src="Homefireworks/Photosbtn.jpg" alt="" name="Photosbtn" width="119" height="23" border="0" id="Photosbtn" /></a></td>
<td rowspan="2"><img src="Homefireworks/homebanner_r2_c12.jpg" alt="" name="homebanner_r2_c12" width="1" height="712" border="0" id="homebanner_r2_c12" /></td>
<td><a href="javascript:;" target="_top" onclick="MM_nbGroup('down','navbar1','Writingsbtn','Homefireworks/Writingsbtn_f3.jpg',1);" onmouseover="MM_menuShowMenu('MMMenuContainer0820183802_1', 'MMMenu0820183802_1',0,23,'Writingsbtn');MM_nbGroup('over','Writingsbtn','Homefireworks/Writingsbtn_f2.jpg','Homefireworks/Writingsbtn_f3.jpg',1);" onmouseout="MM_nbGroup('out');MM_menuStartTimeout(1000);"><img src="Homefireworks/Writingsbtn.jpg" alt="" name="Writingsbtn" width="119" height="23" border="0" id="Writingsbtn" /></a></td>
<td rowspan="2"><img src="Homefireworks/homebanner_r2_c14.jpg" alt="" name="homebanner_r2_c14" width="1" height="712" border="0" id="homebanner_r2_c14" /></td>
<td colspan="2"><a href="javascript:;" target="_top" onclick="MM_nbGroup('down','navbar1','Donatebtn','Homefireworks/Donatebtn_f3.jpg',1);" onmouseover="MM_nbGroup('over','Donatebtn','Homefireworks/Donatebtn_f2.jpg','Homefireworks/Donatebtn_f3.jpg',1);" onmouseout="MM_nbGroup('out');"><img src="Homefireworks/Donatebtn.jpg" alt="" name="Donatebtn" width="118" height="23" border="0" id="Donatebtn" /></a></td>
<td rowspan="6"><img src="Homefireworks/homebanner_r2_c17.jpg" alt="" name="homebanner_r2_c17" width="17" height="956" border="0" id="homebanner_r2_c17" /></td>
<td><img src="Homefireworks/spacer.gif" width="1" height="23" border="0" alt="" /></td>
</tr>
<tr>
<td colspan="3"><img src="Homefireworks/homebanner_r3_c3.jpg" alt="" name="homebanner_r3_c3" width="124" height="689" border="0" id="homebanner_r3_c3" /></td>
<td><img src="Homefireworks/homebanner_r3_c7.jpg" alt="" name="homebanner_r3_c7" width="118" height="689" border="0" id="homebanner_r3_c7" /></td>
<td colspan="3"><img src="Homefireworks/homebanner_r3_c9.jpg" alt="" name="homebanner_r3_c9" width="119" height="689" border="0" id="homebanner_r3_c9" /></td>
<td><img src="Homefireworks/homebanner_r3_c13.jpg" alt="" name="homebanner_r3_c13" width="119" height="689" border="0" id="homebanner_r3_c13" /></td>
<td colspan="2"><img src="Homefireworks/homebanner_r3_c15.jpg" alt="" name="homebanner_r3_c15" width="118" height="689" border="0" id="homebanner_r3_c15" /></td>
<td><img src="Homefireworks/spacer.gif" width="1" height="689" border="0" alt="" /></td>
</tr>
<tr>
<td colspan="2"><img src="Homefireworks/homebanner_r4_c3.jpg" alt="" name="homebanner_r4_c3" width="99" height="1" border="0" id="homebanner_r4_c3" /></td>
<td rowspan="2" colspan="5"><a href="javascript:;" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('homebanner_r4_c5','','Homefireworks/homebanner_r4_c5_f2.jpg',1);"><img src="Homefireworks/homebanner_r4_c5.jpg" alt="" name="homebanner_r4_c5" width="240" height="111" border="0" id="homebanner_r4_c5" /></a></td>
<td rowspan="4"><img src="Homefireworks/homebanner_r4_c10.jpg" alt="" name="homebanner_r4_c10" width="23" height="244" border="0" id="homebanner_r4_c10" /></td>
<td rowspan="2" colspan="5"><a href="javascript:;" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('homebanner_r4_c11','','Homefireworks/homebanner_r4_c11_f2.jpg',1);"><img src="Homefireworks/homebanner_r4_c11.jpg" alt="" name="homebanner_r4_c11" width="240" height="111" border="0" id="homebanner_r4_c11" /></a></td>
<td rowspan="4"><img src="Homefireworks/homebanner_r4_c16.jpg" alt="" name="homebanner_r4_c16" width="1" height="244" border="0" id="homebanner_r4_c16" /></td>
<td><img src="Homefireworks/spacer.gif" width="1" height="1" border="0" alt="" /></td>
</tr>
<tr>
<td rowspan="3"><img src="Homefireworks/homebanner_r5_c1.jpg" alt="" name="homebanner_r5_c1" width="18" height="243" border="0" id="homebanner_r5_c1" /></td>
<td rowspan="2" colspan="2"><a href="javascript:;" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('homebanner_r5_c2','','Homefireworks/homebanner_r5_c2_f2.jpg',1);"><img src="Homefireworks/homebanner_r5_c2.jpg" alt="" name="homebanner_r5_c2" width="240" height="111" border="0" id="homebanner_r5_c2" /></a></td>
<td rowspan="3"><img src="Homefireworks/homebanner_r5_c4.jpg" alt="" name="homebanner_r5_c4" width="23" height="243" border="0" id="homebanner_r5_c4" /></td>
<td><img src="Homefireworks/spacer.gif" width="1" height="110" border="0" alt="" /></td>
</tr>
<tr>
<td rowspan="2" colspan="5"><img src="Homefireworks/homebanner_r6_c5.jpg" alt="" name="homebanner_r6_c5" width="240" height="133" border="0" id="homebanner_r6_c5" /></td>
<td rowspan="2" colspan="5"><img src="Homefireworks/homebanner_r6_c11.jpg" alt="" name="homebanner_r6_c11" width="240" height="133" border="0" id="homebanner_r6_c11" /></td>
<td><img src="Homefireworks/spacer.gif" width="1" height="1" border="0" alt="" /></td>
</tr>
<tr>
<td colspan="2"><img src="Homefireworks/homebanner_r7_c2.jpg" alt="" name="homebanner_r7_c2" width="240" height="132" border="0" id="homebanner_r7_c2" /></td>
<td><img src="Homefireworks/spacer.gif" width="1" height="132" border="0" alt="" /></td>
</tr>
</table>
<div id="MMMenuContainer0820183802_0">
<div id="MMMenu0820183802_0" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuResetTimeout();"> <a href="javascript:;" id="MMMenu0820183802_0_Item_0" class="MMMIFVStyleMMMenu0820183802_0" onmouseover="MM_menuOverMenuItem('MMMenu0820183802_0');"> Photos </a> <a href="javascript:;" id="MMMenu0820183802_0_Item_1" class="MMMIVStyleMMMenu0820183802_0" onmouseover="MM_menuOverMenuItem('MMMenu0820183802_0');"> Movie </a> </div>
</div>
<div id="MMMenuContainer0820183802_1">
<div id="MMMenu0820183802_1" onmouseout="MM_menuStartTimeout(1000);" onmouseover="MM_menuResetTimeout();"> <a href="javascript:;" id="MMMenu0820183802_1_Item_0" class="MMMIFVStyleMMMenu0820183802_1" onmouseover="MM_menuOverMenuItem('MMMenu0820183802_1');"> CHU Reports </a> <a href="javascript:;" id="MMMenu0820183802_1_Item_1" class="MMMIVStyleMMMenu0820183802_1" onmouseover="MM_menuOverMenuItem('MMMenu0820183802_1');"> Trip Journals </a> </div>
</div>
</div>
</div>
</body>
</html>
 
I'll need the link to see what's happening and get full access to all your CSS.

I also noticed odd markup such as "@import url("Homefireworks/homebanner.css");" repeated multiple times, might want to clean that up.

-jim
 
Your page seems quite the mess... :p

Try not to put the flash file on a layer, remove the exact fit param, and specify the width and height to fit the container.

Should work fine then.
 
Thanks guys for the suggestions. I haven't upload this to a server yet, and don't plan to for a while. Is there another way I can get it to you?

I've only been using DW for a week, and I still pretty much know nothing about it. For the repeated lines, I think it is from deleting, and importing the same thing multiple times from me messing with things. I'll eventually start over clean once I figure things out.

I will give the suggestions a try tomorrow.

Thanks again guys!
 
Guys,

Sorry for not knowing anything, I searched on how to add some div tags, but I am completely lost. How do I go about putting the Flash inside my Fireworks layout using div? Is there a good tutorial that is meant for the ignorant novice? I really like to learn it, perhaps I'll buy a book.

Thank you once again.
 
As simple as I can make it for ya:

HTML:
<div id="myflash">
<object>...your code here...</object>
</div>

Simply wrap a div tag around the HTML that generates the Flash embedded object in your source code manually edited by hand. There is one attribute to pass to it, the ID which I made up as "myflash" in the example above. This ID can then be referenced in your CSS style sheet as:

Code:
#myflash {
 ...various CSS statements here;...
}

If you are new to CSS and using DIV's please visit this tutorial to learn about basic CSS, selectors, ID's, classes and psuedo classes:

http://www.w3schools.com/css/

-jim
 
Yep, learn HTML first.

Take a class is a good idea, it's structured and you can ask questions and interact with other students. The real learning comes from doing, i.e. creating actual code, modifying other people's code, tweaking things to see the effect, and using Google alot to look things up.

Here's the W3C Schools basic tutorial for HTML for beginners, browse through it, take the quiz for fun, and you'll do great in school because you will already be familiar with the basic concepts. Remember, W3Schools teaches you stuff by showing you best practices and following strict standards, meaning you're learning it the right way from the first day.

The W3C refers to the World Wide Web Consortium, the group that sets the standards for Internet web development. Move to CSS next after you know HTML, such as your tutorial link you listed in your last reply. Then advance to XHTML which is really just a refinement and stricter set of standards of HTML working with CSS.

Happy learning! Note, others following this might suggest more resources, be open to all suggestions, we're here to help and inspire you!

-jim
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.