HTML - Center Flash With Swfobject 2code.
Hi,
Im trying to switch over to using swfobject 2 to display my flash. I seem to have everything in place apart from having my site centered. I only want it horizontally centered. Here's my current code. Any help is very much apreciated. <!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>FlashVideoTutorials Flash Video Tutorials, XML Templates And Web Design</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <script type="text/javascript" src="swfobject.js"></script> <script type="text/javascript"> swfobject.embedSWF("index.swf", "myContent", "800", "600", "8.0.0", "expressInstall.swf"); </script> <script language="JavaScript"> function openNewWindow(URLtoOpen, windowName, windowFeatures) { newWindow=window.open(URLtoOpen, windowName, windowFeatures); } </script> <style type="text/css"> <!-- .style1 {color: #FFFFFF} --> </style> </head> <body bgcolor="#000000"> <div align="center" id="myContent"> <h1 class="style1">Alternative content</h1> <p><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></p> </div> </body> </html> Thanks Alan Similar TutorialsFor my website, there is a swf that plays on the home page. The problem is that people who can't view flash files end up seeing that blue lego icon instead. I want to have a jpeg display if the user cannot view an swf. I heard that an swfobject might be the solution. Does anyone know the code to make this work? Thanks so much. Hello! I have used SWFobject to validate my flash object in my website http://nikolay100.comuv.com/. When I test my site on my computer everything looks great, but when I upload my site to the server, my flash object disappears. Please tell me where is my mistake. Thank you in advance! I'm having an issue with the size of my main.swf. When I use the swfobject.embedSWF code, leaving it as 100% 100% covers the entire browser window obscuring my background image. In order to view the image I have entered '1000' and '725' which are the dimensions of my main.swf. However, this left aligns the swf and the height appears to not work, I am left with a black box that extends from the bottom of my main.swf to the bottom of the browser window. What do I need to adjust in order to keep my main.swf top aligned, centered horizontally and my background image visible. Also, if anyone happens to know how I could have the background image scale to fit horizontally/vertically without repeating, that would be great. Thanks. HTML Code: <!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>Website Title</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="swfobject/swfobject.js"></script> <script type="text/javascript" src="swfaddress/swfaddress.js"></script> <script type="text/javascript"> swfobject.embedSWF('main.swf', 'website', '1000', '100%', '9.0.45', 'swfobject/expressinstall.swf', {}, {bgcolor: '#CCCCCC', menu: 'false'}, {id: 'website'}); </script> <style type="text/css"> /* hide from ie on mac \*/ html, body, #website { height: 100%; overflow: hidden; } /* end hide */ body { background-image: url(images/background.png); background-repeat: no-repeat; background-position: 50% 0%; margin: 0; padding: 0; font: 86% Arial, sans-serif; } </style> </head> <body> <div id="website"> <p>In order to view this page you need Flash Player 9+ support!</p> <p> <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> </p> </div> </body> </html> Hi, I'm using swfobject.js to rope in a piece of flash onto the top of my page. I'm then using a fixed width div (below the div with the contained swf) with a background image. I'm trying to get the swf and background image to merge seamlessly, but so far no cigar. Take a look: http://www.drayfuss.co.uk/diss/site/siteDraft.html I've tried all sorts of border/margin/padding css techniques but nothing seems to be bridging that gap between the swf and the following div. Am I being dim? Cheers, drayfuss I have a jailbroken iPhone 4 and I am trying to get a flash embed to display on it but I am having a lot of trouble. i have successfully used and enabled different flash objects elsewhere but this is the only one that wont run. so I know it will work. HTML Code: <head> <title>iSwim</title> </head> <body> <div style="width: 320px; height: 356px; margin-top: 80px; margin-bottom: 44px;"> <object width="320" height="356"> <param name="movie" value="http://listen.grooveshark.com/widget.swf" /> <param name="wmode" value="opaque" /> <param name="allowScriptAccess" value="always" /> <param name="flashvars" value="hostname=cowbell.grooveshark.com&widgetID=22770693&style=metal&bbg=000000&bfg=046cc7&bt=FFFFFF&bth=000000&pbg=FFFFFF&pbgh=046cc7&pfg=000000&pfgh=FFFFFF&si=FFFFFF&lbg=FFFFFF&lbgh=046cc7&lfg=000000&lfgh=FFFFFF&sb=FFFFFF&sbh=046cc7&p=0" /> <embed src="http://listen.grooveshark.com/widget.swf" type="application/x-shockwave-flash" width="320" height="356" flashvars="hostname=cowbell.grooveshark.com&widgetID=22770693&style=metal&bbg=000000&bfg=046cc7&bt=FFFFFF&bth=000000&pbg=FFFFFF&pbgh=046cc7&pfg=000000&pfgh=FFFFFF&si=FFFFFF&lbg=FFFFFF&lbgh=046cc7&lfg=000000&lfgh=FFFFFF&sb=FFFFFF&sbh=046cc7&p=0" allowScriptAccess="always" wmode="opaque" /></object> </div> </body> Can anyone help me to make sure the flash displays right? what happens is the player loader displays at the top instead of the center and the control buttons are present before it loads. then after the loader fails it shows a "cannot connect" error. so I think the flash object is resizing inside its self. can anyone help me clean up this script so it will display correctly in iPhone safari (with flash enabled)? website is he smalldotdesign.zxq.net/iSwim.html that is where the HTML file is located that I am trying to get corrected. thanks in advance. i have a feeling this is going to be a tough fix. Hey, Im making a site for a client and we've hit a dead end one one thing i particular The whole site we've made is HTML and Images only. The only flash element is the Navigation bar at the top. With out making 2 dedicated flash/non flash sites, how do we make it so that if flash is not detected on the viewers computer then the flash navigation will not show, but instead show a java script rollover nav bar? I was thinking maybe have the flash nav in a div that floats over the image nav, and if flash is not detected it would disappear...? help would be super appreciated. -Mongoose this is the code I tryed ---------------------------------------------------------------------------------------------------- <img style="position:absolute; top:25px; left:270px" src="http://www.amarasoftware.com/slideshow.swf"quality=high pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="200" height="200"> ----------------------------------------------------------------------------------------------------- I put it within a series of other links and images and so on ------------------------------------------------------------------------------------------------------ href="http://www.msplinks.com/MDFodHRwOi8veGlpaS51cy9tcy9kaXYtb3ZlcmxheQ==">myspace div overlay code tutorial by Eileen</a></i><i class=i>!-Begin Block to set Table Level and Open custom Div-!</i><i class=i>Close ALL open tables so that our div is not effected by the stuff we have removed </i></td></tr></table></td></tr></table></td></tr></table><i class=i>!! top banner, or anything else outside of your core content space can go here!!</i><i class=i>!!Create and size our div.!! </i><div class="myCoreDiv" style="width:800px; height:auto !important; border:0px violet solid; position:relative; top:0px; overflow:hidden; z-index:0;"><i class=i>!!-----START Core Custom CONTENT------!! </i> <img src="http://img152.imageshack.us/img152/5053/lgallerynewcopyox2.jpg"> <a href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVzc2FnZSZmcmllbmRJRD0z NDU1MTgzNDYmTXlUb2tlbj0="style="position:absolute; top:700px; left:170px;"><img src="http://x.myspace.com/images/clear.gif" style="width:160px; height:50px; "></a> <a href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPWludml0ZS5hZGRmcmllbmRfdmVyaWZ5 JmZyaWVuZElEPTM0NTUxODM0Ng=="style="position:absolute; top:660px; left:30px;"><img src="http://x.myspace.com/images/clear.gif" style="width:150px; height:40px; "></a> <a href="http://www.msplinks.com/MDFodHRwOi8vdmlld21vcmVwaWNzLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPXVzZXIudmlld1BpY3R1cmUmZnJp ZW5kSUQ9MzQ1NTE4MzQ2JmFsYnVtSWQ9MA=="style="position:absolute; top:760px; left:180px;"><img src="http://x.myspace.com/images/clear.gif" style="width:150px; height:40px; "></a> <a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LnRoZWxnYWxsZXJ5Lm5ldC8="style="position:absolute; top:730px; left:30px;"><img src="http://x.myspace.com/images/clear.gif" style="width:150px; height:40px; "></a> <a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LnNjb3R0ZHVwcmFzLmNvbS8="style="position:absolute; top:800px; left:30px;"><img src="http://x.myspace.com/images/clear.gif" style="width:160px; height:50px; "></a> <img style="position:absolute; top:25px; left:270px" src="http://www.amarasoftware.com/slideshow.swf"quality=high pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="200" height="200"> <i class="i">!!-------END Core CUSTOM CONTENT--------!!</i><i class="i">!!Open same number of tables we closed.!! </i><table class="myTclass0"><tr><td class="hideIfInInterests"><table class="i"><tr><td><table><tr><td><i class="off">!-END Custom Block to Set Table Level and Create Custom Div-!</i> ------------------------------------------------------------------------------------------------------- The code highlighted red comes in on my div as a box with a small x. So its detected to be there but some how doesnt pick up the content of the (swf.). And I have to be honest I really don't know much about html at all.... I use it for my website and band myspace layout. This is for a photographers myspace. But I would greatlly apprecieate it if someone could please explain to me what I should put there I would worship you... Well thanks everyone for looking through this mess. I hope theres someone out there with an awnser. I've just published my first flash site, which is a schoolproject. I have this little problem: my site won't center in the popup so i get this white border in top and left site while some of my site is missing in right and bottom.. you can see it he http://www.rtgkom.dk/~caspers06/ click on anotherDepth. Here's the code i used for my popup: Code: <SCRIPT LANGUAGE="JavaScript"> function popUp(URL) { day = new Date(); id = day.getTime(); eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width=959,height=500,left = 35.5,top = 128');"); } </script> Code: <a href="" onClick="MinPopUp('http://www.rtgkom.dk/~caspers06/main.html');return false;"> <A HREF="javascript:popUp('http://www.rtgkom.dk/~caspers06/main.html')"><img src="images/index_09.gif" alt="" width="254" height="58" border="0"></A> Hope someone can help me.. Btw, if this is posted the wrong place im very sorry but i could'nt find anything about javascript. I am administering this forum www.br-eeze.com So please enter there as the flashing banner and the weather widgets. Both are positioned on the left. Now this is the code for the banner: <td align="center" valign="top" width="90" height="55"><A target = "_blank" HREF="http://www.br-eeze.com"><IMG SRC="http://www.xxx.com/test1.gif" border=0 width=728 height=90 ></a> As you can see I tried to center it. I even typed right but still everything is aligned to the left. PLEASE, how do I center the banner and the weather widgets? <tr> <td class="contentarea_b"></td> </tr> <h3>=WFC= WAR FORCE CLAN AMERICAS ARMY</h3> <table cellpadding="0" cellspacing="0" border="0"><tr><td><object type="application/x-shockwave-flash" data="http://video.google.com/googleplayer.swf?docId=4279961105245592436&hl=en" height="350" width="425" style="width:400px; height:326px;" id="VideoPlayback"> <param name="movie" value="http://video.google.com/googleplayer.swf?docId=4279961105245592436&hl=en" /> <param name="allownetworking" value="internal" /> <param name="allowScriptAccess" value="ALWAYS" /> <param name="enableJSURL" value="TRUE" /> <param name="enableHREF" value="TRUE" /> <param name="saveEmbedTags" value="true" /> <param name="flashvars" value="" /> </object></td></tr><tr><td> </table> </td> Hey im new at this html programming and im ok at it but i still need to learn more i need help centering the stuff on my page you will see what i mean if you go to my website. firefoxskins.awardspace.com. I would really like help thank you for your time. Hey felllas. I really need some help here. I'm building this page, but can't get it to center. I bet it's somethign dumb I'm overlooking. could you please take a quick look at the source and LMK what I'm missing... http://bravoad.com/BravoTest2.html Thanks in advanced http://www.ivoog.com/test/help The boxes that have: Paypal, Policies, Financing, Wholesale, etc. How can these be centered in all browsers including IE6? I can't get it to work Here's the CSS: #othermain2 { width:850px; height:850px; float:left; } #middlestyle { width:850px; text-align:center; margin:auto; overflow:auto; } .middlebox { width:150px; text-align:center; float:left; font-size:24px; margin-left:50px; margin-top:50px; border:solid 5px #333; } .middlebox:hover { width:150px; text-align:center; float:left; font-size:24px; margin-left:50px; margin-top:50px; border:solid 5px #390; } FULL CSS: http://www.pics.ivoog.com/page/home.css Can anyone help me? Thanks. I am learning how to use Div's to replace Tables for layout. Needless to say, there are many properties I need to learn with CSS's. A friend wants a Floating area on the left which I have created, however I would like to have the box be centered in the main text area. Not sure if that can be done with my prototype at http://www.toddcary.com/viewpoint/div_todd_a.html Any help would be appreciated... Todd Quick question. When using a generator to make a website, it seems that usually everything is placed into "DIV - ABSOLUTE" codes. How do I center everything up so it isn't all stuck to one side for users who have a higher resolution? I have a webpage with a header, column on each side, footer and a mainContainer in the middle. I would like to set up links on the left column that, when clicked, open a new 'page' in the center (mainContainer). I am using all div tags, no tables. Could someone point me in the right direction? TIA I Can't center my whole nav bar in the middle of the sidebar 1 div. Here is the link for the website. http://northwindappaloosas.com/NewHome.html I have several div tags that I want exactly where I place them regardless of a user's screen size / resolution ... if I place them right of left 200 px then they shfit depending on resolution ... samve if I place them right of left by, say 85%. I'm figuring if I place the div tage left of center or right of center then they will always position correctly because the center doesn't vary according to resolution. How do I do this? I tried document.getElementById("divid").style.center = "25"; (i was attempting 25 pixels right of center) but it doesn't work. Any suggestions? Thanks! This will proubly be easy for some of you but i need some help. veiw www.aeonnorth.com source. And tell me why i cant get the top 5 buttons to link? Service-Products-Forums-Contact-Support. I have a map set up. but doenst seem to be working. whats wierd is i can mouse over and see its a link but doesnt take me anywhere. please help Hello there, This problem might belong in the serverside section, but it seems to be syntax related, so I'll post it here for now. The current problem can be seen at: http://urkedaljenssen.no/hp/gallery/images/photography/ (The thumbnails become black X's, but do not worry about this, it is a different problem altogether. This is just an example of the application in use) The application in question is Simpleviewer, located at: http://www.airtightinteractive.com/simpleviewer/ (free application) The automated script in which the problem is located is he http://www.airtightinteractive.com/s..._instruct.html (PHP version) Problem: When trying to execute the script, having chmod'ed everything to 777 on all levels, it displays syntax error on line 408. I have checked line 408 in the script and this is the doctype declaration, I can't see any errors in it, but perhaps a fresh pair of eyes can as I have been working Thank you. |