• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 873
  • Last Modified:

Sizing inserted video in HTML5 page -

Hi -

I'm trying to insert code for an external flash video player and the dimensions aren't working. I'm trying to get 800x400, and the width seems to work OK, however the height is limited. I have a banner above the flash player on that page.  I'm not sure which part of the code needs to be tweaked, so not sure which parts to post here.

but here's the code for the flash player I'm inserting:

  <center>

<body>

<embed src="http://www.gdd.ro/gdd/flvplayer/gddflvplayer.swf" flashvars="?&autoplay=false&sound=70&buffer=4&vdo=http%3A%2F%2Fmydomain%2Ecom%2Ffolder%2Ftest%2Eflv" width="200" height="400" allowFullScreen="true" quality="best" wmode="transparent" allowScriptAccess="always"  pluginspage="http://www.macromedia.com/go/getflashplayer"  type="application/x-shockwave-flash"></embed>

</body>

Open in new window


So I see the banner has some css elements. Not sure what is preventing the height to display correctly, but any hints appreciated much. Thanks!
0
Trevor Local
Asked:
Trevor Local
  • 5
  • 3
4 Solutions
 
Kent DyerIT Security Analyst SeniorCommented:
There a reason you are using a center HTML tag outside the body../body html tags?

Shouldn't it be more like this?
  
<html>
<head>
<title>my cool web page</title>
</head>
<body>
<center>
<embed src="http://www.gdd.ro/gdd/flvplayer/gddflvplayer.swf" flashvars="?&autoplay=false&sound=70&buffer=4&vdo=http%3A%2F%2Fmydomain%2Ecom%2Ffolder%2Ftest%2Eflv" width="200" height="400" allowFullScreen="true" quality="best" wmode="transparent" allowScriptAccess="always"  pluginspage="http://www.macromedia.com/go/getflashplayer"  type="application/x-shockwave-flash"></embed>
</center>
</body>
</html>                                  

Open in new window

HTH,

Kent
0
 
Trevor LocalAuthor Commented:
Thanks Kent. I switched that. Any idea about how to get the video height to be what I need? thanks
0
 
BillDLCommented:
delmarlocal

The code you posted clearly sets the dimensions of the player to:
width="200" height="400"
Change those parts to:
width="800" height="400"
and see what happens.

Some web video players will not stretch a smaller video file unless you tell it to with a switch like   NoStretch=False   or similar.  It all depends on what settings the player needs to have specified.

You are using GDD FlvPlayer:
http://www.gdd.ro/free-flash-flv-player
It gives the Parameters on that page and also has a Code Generator.  All it says about the dimensions is this:

ABOUT PLAYER SIZE
You can change the player width and height as you like.  In our sample code we have the 4/3 format, size: 400/340 px (where 40px is the controls-bar height).  Percentage sizes are also accepted (like width 100% and height 100%)


In the download package (http://www.gdd.ro/gdd/flvplayer/gddflvplayer-v3.6.zip) there is an "example.html" file that shows the same HTML Code Generator as the GDD FlvPlayer home page linked to earlier, and has two videos embedded into it.  It is the same page as this one:
http://gdd.ro/flvplayer/examples/example.html

The whole idea of having your own free Web Video Player is that you have the Flash file in your own web webserver space rather than fetching it from the www.gdd.ro site each time you embed a video.  What would happen if their site was down?

It's up to you where you upload it to your site.  Usually it would be best to have your *.FLV files in the same folder as the "gddflvplayer.swf" file, although that does not have to be the case.  You should be able to enter the path to the *.SWF file as a RELATIVE path, ie. relative to the *.HTML web page that is loading it.  You can usually have the path to the FLV file as relative to the HTML page also, so it makes sense to have them in the same folder.

Assuming you have the SWF file for the player and the FLV files in one folder named "videos" on your site, and that you have a custom logo named "delmarlocal.jpg" in that folder, here is the code generated by the code generator for a video named "DIY_Dentistry.flv":
<embed src="videos/gddflvplayer.swf" flashvars="?&autoplay=true&sound=70&mylogo=videos%2Fdelmarlocal%2Ejpg&buffer=2&vdo=videos%2FDIY%5FDentistry%2Eflv" width="800" height="600" allowFullScreen="true" quality="best" wmode="transparent" allowScriptAccess="always"  pluginspage="http://www.macromedia.com/go/getflashplayer"  type="application/x-shockwave-flash"></embed>

Open in new window


You are aware that the    %20   %2E   %2F   etc symbols are HTML replacements for a space, a dot, and a forward slash?

I see that on their home page
http://www.gdd.ro/free-flash-flv-player
they also use the Hex Code for the & (ampersand) character in the embed code, namely   &#038;

Using <embed> code to position Flash-enabled web players is not HTML5, it is old HTML.  One of the new things about HTML5 is that it supposedly should allow new methods for embedding videos in a web page without the need for Flash support, and this is done to enable mobile devices that don't use the Adobe Flash Player plugin to display videos.  As with most "standards", there has been squabbling, dissention, and resistance that mean web developers are left trying to get half-baked standards to work in semi-compliant browsers, so it's far from being a complete replacement for "HTML4" and won't be for a long time.

I hope this helps.

Bill
0
Cloud Class® Course: Amazon Web Services - Basic

Are you thinking about creating an Amazon Web Services account for your business? Not sure where to start? In this course you’ll get an overview of the history of AWS and take a tour of their user interface.

 
Trevor LocalAuthor Commented:
Hi Bill - thanks. Lots of information!

The code I posted was just a sample. I did start out with the width="800" height="400" and only the width changes. I've pasted the code on a blank HTML page and can get the proper dimensions. I've even tested it on a live HTML viewer website, and it displays properly. Just can't seem to get proper dimensions on this current one,  no matter where I put it on the page. I can go wide, but not any higher than what appears to be a height of 200 or close to it.

I'm using the gdd.ro site as a temporary testing tool to see how the video will look on this page, and I'm not sure which domain it will land on, so I will switch over to a local copy of the video player once it does land somewhere. I'll use the snippet of code you gave too.

So- yeah-  not sure what to check on next.

thanks again
0
 
BillDLCommented:
I suppose the next thing you would really have to look at is whether there are any constraints on the pixel dimensions or % of the <DIV> or other container that the embed code is within.

Perhaps if you could direct us to a URL where the page isn't displaying it properly, or provide the full HTML and CSS for that page, we might identify the cause.  If you prefer, post the codes and make the paths/URLs generic like you did with "http://mydomain.com/folder/test.flv"
0
 
Trevor LocalAuthor Commented:
Here's a link to the testing site:

HTML page

If that's doesn't help, I'll go through the HTML and CSS and post that as well.
thanks!
0
 
Trevor LocalAuthor Commented:
I replaced
width="800" height="400" allowFullScreen="true"

Open in new window

with
style="width:800px;height:400px" allowfullscreen="true"

Open in new window


That seems to have done the trick.
0
 
Trevor LocalAuthor Commented:
thanks for the input!
0
 
BillDLCommented:
Thank you delmarlocal
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: CompTIA Cloud+

The CompTIA Cloud+ Basic training course will teach you about cloud concepts and models, data storage, networking, and network infrastructure.

  • 5
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now