Problem with Flash Header

HELP I got the size and seems the dimensions are OK for at least resolutions up to 1280 x 768 but I have lots of black on the top and bottom. How do i get rid of this.

my logowrapper is set to

#logoWrapper{

	/*background-image: url(../images/headerbg.gif);*/

	background-repeat: repeat-x;

	background-color: #000000;

	height:140px;

	margin: 0em;

	padding: 0em;

	}

I have this set in my tpl_header.php

 if ($current_page_base == 'index') {
  require($template->get_template_dir('top_main.php',DIR_WS_TEMPLATE, $current_page_base,'common'). '/top_main.php'); }

  else {
  require($template->get_template_dir('top.php',DIR_WS_TEMPLATE, $current_page_base,'common'). '/top.php'); }?>

My top_main.php is where the flash file is located and that looks like this.

<div><script type="text/javascript" src="includes/templates/arch_shoppe/jscipt/swfobject.js"></script>
 <div id="flashcontent">
   
    
<center>


<embed
src="stxbanner.swf"
width=100%
height=100%
allowscriptaccess="always"
allowfullscreen="true"
/>

</center>

I have tried many other techniques even the swfobject 2.0 and can't seem to get it working correctly. Any thoughts on how to get this correct. I am a newbie and need explanation. Thanks for your time!!

Sawhorse:

I just did a very quick read of some of the latest response in this thread. The only small comment I can help with is that one needs to be careful with your code depending on which version of swfObject you use. Code that was meant for the old 1.4 version will not work well using the 2.0 or 2.1 version of swfObject. And definently, code meant for version 2.1 will not work using the old swfObject 1.4. I found that out the hard way. So, the bottom line is one should stipulate the version of the swfObject when providing the code that will implement flash.

True, but the difference in 1.4 and 2.0 code is easy to see. I haven't had time to look at 2.1, will have to check it out. I forget that I tend to see code differently.. so I do need to tag it better for others.

welchyboy,
Your switching code faster then I can keep track! For complete info on swfObject go to their web site and read up.. http://code.google.com/p/swfobject/wiki/documentation

As for the size issue, code in a resolution sniffer ether in your php or swf movie to auto size it...

davewest:

True, but the difference in 1.4 and 2.0 code is easy to see. I haven't had time to look at 2.1, will have to check it out. I forget that I tend to see code differently.. so I do need to tag it better for others.

welchyboy,
Your switching code faster then I can keep track! For complete info on swfObject go to their web site and read up.. http://code.google.com/p/swfobject/wiki/documentation

As for the size issue, code in a resolution sniffer ether in your php or swf movie to auto size it...

LOL I am so sorry I am just out of time and I am trying not to solely reley on the forum because I DO WANT to actually learn the stuff I am just sooo pressured for time it is really driving me crazy. I have researched swfobjects 2.0 downloaded the 2.1 beta zip from the website and I even watched a video on how to do it but for some reason something isn't correct so I continuously go back to the embed code which is actually working with my site right now and has been working. I just can't get it exactly the way i want. As for the resolution sniffer I haven't a clue what that is so i will research it and see if i can find some information on how to go about doing that.

I forgot to edit that my flash file is 2600 by 300 which is RIDICULOUS but that is the only way i could figure out how to get it to work with other resolutions. will the resolution sniffer fix this so i can make the actual flash file smaller?

[QUOTE=*I tried this script and I get a blank flash box in IE and nothing shows up in FireFox- *

*When I Try loading off of swobject.js all I get is "This Text is replaced by Flash movie" in both IE and FireFox. The good news is at least it's doing the same thing in both *

-[/QUOTE]

You know, the problem might be as simple as your path for your SWF. It might be that swfobject can't find your SWF and thus your get a "blank flash box". Try putting your SWF in your root directory and see if that does not help. It might!!

Crazy enough I got it to work. I am not sure how I have tried the swfobject 2.0 multiple times and even downloaded the "air" one which is a generator. But for some reason it decided to work.

In reply to sawhorse I actually do have my swf in the root directory which wasn't working at first but not it is. Not sure what turned that around but here is what i did...or at least what i have.

I downloaded the swfobjects 2.0 and also used the air generator thing which you can download both of them from here..

http://code.google.com/p/swfobject/

I used the generator and typed in the name of the file and the parameters and generated the code. I uploaded the .js file and the swf file to the server.

My code looks like this for the flash

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
	<head>
		<title></title>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<script type="text/javascript" src="includes/templates/YOUR TEMPLATE/swfobject.js"></script>
		<script type="text/javascript">
			var flashvars = {};
			var params = {};
			params.play = "true";
			var attributes = {};
			attributes.align = "middle";
			swfobject.embedSWF("myflashfile.swf", "myflashfile", "100%", "100%", "9.0.0", "expressInstall.swf", flashvars, params, attributes);
		</script>
	</head>
	<body>
		<div id="myflashfile">
			<a href="http://www.adobe.com/go/getflashplayer">
				<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
			</a>
		</div>
	

</body>
</html>

I hope with this code I would be able to help someone out.

Now for the bad news...I am still having trouble with the black "space" above and below the actual flash file. I believe it is part of the flash file but not sure how or why. This black space also will need to be set to change with resolution i think because I changed resolution and my flash files width went all the way across like it is supposed to (at least for 1280 x 768) however the black color either gets smaller or larger depending on resolution...

I have researched more about the resolution "sniffer" and found different codes but not sure exactly what I need to do. I found this piece of code..

if((System.capabilities.screenResolutionX>1024)&& (System.capabilities.screenResolutionX<1280)){ //Place your actions here }

Also found this code

if(System.capabilities.screenResolutionX==1024){ //Place your actions for 1024 resolution here } else if(System.capabilities.screenResolutionX==800){ //Place your actions for 800 resolution here }

Neither of these I know anything about or how to place my own actions. I will have to refer to the flash file obviously but not sure exactly how to do this part. Anyone have any information about this...

THANKS FOR THE HELP GUYS YALL ROCK :clap:

Does anybody know how to get this code to work for the resolution problem?

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin
function redirectPage() {
var url640x480 = "indexlinks640.html";
var url800x600 = "indexlinks800.html";
var url1024x768 = "indexlinks1024.html";
if ((screen.width == 640) && (screen.height == 480))
window.location.href= url640x480;
else if ((screen.width == 800) && (screen.height == 600))
window.location.href= url800x600;
else if ((screen.width == 1024) && (screen.height == 768))
window.location.href= url1024x768;
else window.location.href= url640x480;
}
// End -->
</script> 

I tried putting this into my top_main.php which contains my flash information. I took the current flash information out and placed this code in its place. Then I changed the html pages to top_main1.php which contained my "working" flash information. However all i got was a black screen.

welchyboy:

...I am still having trouble with the black "space" above and below the actual flash file. I believe it is part of the flash file but not sure how or why. This black space also will need to be set to change with resolution i think because I changed resolution and my flash files width went all the way across like it is supposed to (at least for 1280 x 768) however the black color either gets smaller or larger depending on resolution...

I have researched more about the resolution "sniffer" and found different codes but not sure exactly what I need to do. I found this piece of code..

I do not know anything about a resolution "sniffer" and I doubt that you need it. What I am aware of is that you must keep that same proportions. If you force a certain a length then the width will be proportional to the original. If you do not meet the the exact proportion the difference will be filled in (depending on the setup) with black/white.

So what does that mean...I should set it to percent or an actual length? Because I believe everytime I try and specify a specific length of the flash content it overshoots the page completely or it will be short. I just want something that is normal what does everyone else do with their flash banners lol?

Sorry for not making this clear.
1) I am talking about a flash video in general, not specifically about a banner
2) I am using swfObject ver2.1 and in 2.1 you specify length and width.
3) If your video is in a 9:16 ratio but your space you are trying to put your video in is a 10:16 ratio you will get black space.
4) If you are putting your video on your main page (define_main_page.php) and you are using swfObject ver2.1 you can specify the size of the video:

var att = { data:"includes/templates/Series_12_Horses/flash/homepage.swf", width:"600", height:"240"}; 

 (The above was copied from my site main page)
 5) Note that the swf and the stipulated width and height (width:"600", height:"240") must be in the same ratio (mine is 1:1)
  6) If it is not in the same ratio **I BELIEVE** the video will have black space.

This is all the info I have. I am not a programmer. Someone more skilled will need to help you further.

Best of luck.

OK I will research this line of code to see what it does for me. I understand what you are saying but i think the problem is if i set the banner to say i don't know 700 width by 120 height that might look great with no black space what so ever and everything looks good on my monitor. But if someone starts looking at my site with other resolutions the page will loko different because 700 pixels wide will look much different on a larger resolution. So I do understand and with videos i don't think resolution will affect this too much. But the banner I was hoping to have it across the top of the page. I thank you for your comments and I will research that piece of code. If anyone else has a solution they would like to propose please let me know. Thanks

Hi!
I am a new Zenner. Please help me out to setup a flash banner at white space located under the header, in replacement of bg_banner image. You may check the webpage at http://www.rabiabooks.com/ for reference.

I look forward to your nice co-operation.

Regards,
Fareed

Template looks like one from Template Monster..
If so, search forums for Template Monster..nothing
is standard in their designs so adding flash banner
will not be straightforward.
:(

Still having issues with the "black" space on my flash banner can any one help me please.

welchyboy:

Still having issues with the "black" space on my flash banner can any one help me please.
Without url of site not possible to view existing code
:blink:

Sorry...

http://www.wpc-consulting.com/~stxmill/

Do not use same formula for embedding flash header
as used on that site, so without having actual swf file,
sorry, cannot help/advise further.
:dontgetit

Try editing your Stylesheet [stylesheet.css around line 436]
Change height from 140 to 114. That should help.

#logoWrapper 
background-color:#000000;
background-repeat:repeat-x;
height:114px;   
margin:0;
padding:0;

This is a great suggestion. I have worked with this part before but didn't get too far. I tried it just now and changed it to 114 and the height looks good but now the width shrunk big time. So now there are huge black spaces on the left and right. I added the width:"100%"; to the logowrapper and changed the height to 100" and I see LOTS and LOTS of black space above and below the file but this is because the actual height of the flash file is rather big. I will change that to 140 or 150 and see how that looks with the height at 100%. Because the width of the banner looked great when the height is bigger for some reason. I think the solution is somewhere in here i think we are very close. Thanks for your help!!

MISTY are you wanting my swf file? Or what can i give you to help you out so you can help me out lol. Let me know and I will do what i can. Thanks for everyone's help yall are amazing!

welchyboy:

This is a great suggestion. I have worked with this part before but didn't get too far. I tried it just now and changed it to 114 and the height looks good but now the width shrunk big time. So now there are huge black spaces on the left and right. I added the width:"100%"; to the logowrapper and changed the height to 100" and I see LOTS and LOTS of black space above and below the file but this is because the actual height of the flash file is rather big. I will change that to 140 or 150 and see how that looks with the height at 100%. Because the width of the banner looked great when the height is bigger for some reason. I think the solution is somewhere in here i think we are very close. Thanks for your help!!

Sawhorse nailed it for you some time back, Flash is not the same as a image. It doesn't distort like a image. When the space it occupies is not the same ratio as the flash stage, the ratio changes to fit the entire movie leaving the stage background color and any peace of animation that is off stage in view. You use black as your stage background, thus the black borders. My flash banner on my blog was designed for fast loading. It's was designed at a 1/3 of it's intended display size. It too would show it's background and off stage animation if I didn't adhere to it's size ratio.
I would down size your flash for faster load. You also seem to be loading swfobject twice as will two head sections, not sure if this is intended, but may give you trouble down the road. The more things you load that you don't need can slow down page load...

davewest:

Sawhorse nailed it for you some time back, Flash is not the same as a image. It doesn't distort like a image. When the space it occupies is not the same ratio as the flash stage, the ratio changes to fit the entire movie leaving the stage background color and any peace of animation that is off stage in view. You use black as your stage background, thus the black borders. My flash banner on my blog was designed for fast loading. It's was designed at a 1/3 of it's intended display size. It too would show it's background and off stage animation if I didn't adhere to it's size ratio.
I would down size your flash for faster load. You also seem to be loading swfobject twice as will two head sections, not sure if this is intended, but may give you trouble down the road. The more things you load that you don't need can slow down page load...

Well what I did is change the stage color to the same color as the background and got it as close as i could. It is barely noticeable now. I am interested in making the flash file actually smaller so it will load faster it is a little less than 700k. Which is big for 56k. However I want it to look good and the reason it is soooo big is because my flash files width is 2600 so I have to make the image huge. Although I have a flash loader which at least will tell the customer that it is loading but if i can while making it look good load a little faster. Thanks for all your help and I think I am finally getting the flash file at least decent I am almost happy with it lol. Any suggestions on how to make it better or quicker? I have only tested the file with about 1280 by 768 and lower resolution.