|
HTML - Wrap Text Around Embedded Video
Hi all, I'd like some help with the coding so that I can wrap text around embedded video. I'm not a genious at HTML so if you could make it easy to understand that would be great. Thanks in advance.
Similar TutorialsHere is the code I'm using to put in the video window: HTML Code: <script>
function doChangeVideo(myVal)
{
mediaPlayer.autoStart= "true"
mediaPlayer.fileName= myVal
}
</script>
.
.
.
<table border='0' cellpadding='0' align="center">
<tr><td>
<OBJECT id='mediaPlayer' width="320" height="285"
classid='CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95'
codebase='http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701'
standby='Loading Microsoft Windows Media Player components...' type='application/x-oleobject'>
<param name='fileName' value="mms://media.huntingtonnews.net/video/2007/TheClinicalCenterPlant-1.wmv">
<param name='animationatStart' value='true'>
<param name='transparentatStart' value='false'>
<param name='autoStart' value="false">
<param name='showControls' value="true">
<param name='loop' value="false">
<EMBED type='application/x-mplayer2'
pluginspage='http://microsoft.com/windows/mediaplayer/en/download/'
id='mediaPlayer' name='mediaPlayer' displaysize='4' autosize='-1'
bgcolor='darkblue' showcontrols="true" showtracker='-1'
showdisplay='0' showstatusbar='-1' videoborder3d='-1' width="320" height="285"
src="mms://media.huntingtonnews.net/video/2007/TheClinicalCenterPlant-1.wmv" autostart="false" designtimesp='5311' loop="false">
</EMBED>
</OBJECT>
</td></tr>
<!-- ...end embedded WindowsMedia file -->
<!-- begin link to launch external media player... -->
<tr><td align='center'>
<a href="mms://media.huntingtonnews.net/video/2007/TheClinicalCenterPlant-1.wmv" style='font-size: 85%;' target='_blank'>Launch in external player</a>
<!-- ...end link to launch external media player... -->
</td></tr>
</table>
<CENTER><form>
<select name="section" size="1" language="javascript" onChange="doChangeVideo(this.options[selectedIndex].value);">
<option selected>Select a video...</option>
<option value= "mms://media.huntingtonnews.net/video/2007/BillDargusch-Downtowns-1.wmv">Happy Daze</option>
<option value= "mms://media.huntingtonnews.net/video/2007/AtlantisLaunch-1.wmv">Shuttle Atlantis Suffers Some Damage during Launch</option>
<option value= "mms://media.huntingtonnews.net/video/2007/TheTams@PullmanSquare-1.wmv">Pullman Kicks Off Summer Concert Series</option>
</select>
</form></CENTER>
And everytime you scroll the page up and down the video just stalls on a single frame and the controls can't get it running correctly again, you just have to choose another option. And also any time I choose an option on the drop down menu the entire page locks up until the streaming video completes buffering. I'm using the CIT embedded video generator code here so I don't know it as well as I should but are there some ways to fix those problems with it or is it just going to be like that with embedded windows media player?... Codeguru Is there any way to embed windows media video into html without using active-x. This would be for a computer without administrative priveledges (unable to download active-x components) to view video through an html interface. I can only think of using a direct link to the file, which would require the player to be used externally. I think any embedded call up of the player will need to use embed or object tags, which need active-x (as far as I can tell, and my testing has shown) Any light shone on this black math would be greatly appreciated-- Thanks, Tim I would like to include on my website streaming HD video not unlike Youtube or Vimeo. How hard is this? Both in terms of the video compression and the coding for the site. Where do I look for info to help me out? I have a very basic knowledge of HTML and CSS, but not much else. Are the videos on Youtube and Vimeo flash? I am not sure if "streaming" or "embedded" is the proper term for what I want to do. I'll be starting with mp4 files, since those are best for encoding HD... I use x264 codec and encode 720p @ 2.5Mbps for great quality and decent filesize. But somehow Youtube compresses it even further. Example, I had a 5 minute 720p mp4 file that was around 100MB. I uploaded it to Youtube and it is now available in HD and looks pretty good. But if I watch my network connections as I am streaming it, only 20MB transfers... which means they compressed it 5 times better than I had it! That is definitely important because if I try to have streaming HD and it's not compressed enough, it won't be watchable for most people. Hello! I'm developing a site for a local comedy troupe and was wondering what would be the best way to go about this. Here is the draft: www.djhmusic.com/tlk Listed at the top left are each of the troupe's sketches. I want to be able to click on, for example, "Mood Rings" and have the youtube embedded video play in that video window where the player graphic is. The embed code for the Mood Rings video on youtube is: <code> <!--Begin <object width="425" height="350"><param name="movie" value="http://www.youtube.com/v/INuh84DCJbM"></param><param name="wmode" value="transparent"></param><embed src="http://www.youtube.com/v/INuh84DCJbM" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed></object> --end> </code> What's the best/easiest way to do this? iframes? Thanks so much, Dan Hello guys, I have embedded this video on simple html page. I want that video to float in the middle of the screen. It looks OK on FireFox, but it appears on the left edge when played on Safari. (I have not checked it on IE.) What is wrong with that code? here is the link to that page: http://www.icebergfilms.com/cineDemo.html and here is that code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN"> <html> <head> <title>cinematography Demo by IcebergFilms</title> </head> <body bgcolor="#000000"> <object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" codebase="http://www.apple.com/qtactivex/qtplugin.cab" height="256" width="320"> <param name="src" value="http://www.icebergfilms.com/demo1.mov"> <param name="autoplay" value="true"> <param name="type" value="video/quicktime" height="448" width="768"> <table width="768" height="548" align="center"> <tr> <td><embed src="http://www.icebergfilms.com/demo1.mov" align="middle" height="448" width="768" autoplay="true" type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/"></td> </tr> </table> </object> </body> </html> Thank you so much for any advise. I would like to link an youtube video on one of my blog post using the embedded code that youtube provided. So I added in my post html view this code: <iframe width="640" height="360" src="http://www.youtube.com/embed/mIhqjRWZ77Y" frameborder="0" allowfullscreen></iframe> Before to publish the post I tested it, with the wordpress preview option. Some browser not works well.This is the scenario: 1) Using the last version of the Internet Explorer browser the post with the video works fine. 2) Using the last version of the Google Chrome browser I have to reload the html page two times before to view exactly the embedded video. After that the page works fine but when I load for the first time the page I don't see the video. 3) Using the last version of the Safari and the Firefox browser I have to reload two times the html page before to view the embedded video and after I have a problem viewing the video. The message is that the format video is not supported. Could you please help me to solve the problem. Which is the correct way to use the embedded code starting from youtube website ? How can I debug the issue ? Thanks a lot. Hi i have sucessfully added an embedded code to my site... not a problem.. copied and pasted html coding from a video.. into html view.. fine. However.. the video appears top left of my page always. Within the embed video code i see no parameters for screen positioning.. just size.. which is repeated twice (all codes from utube vids etc seem the same) eg <object width="400" height="300" ><param name="allowfullscreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="movie" value="http://www.facebook.com/v/124990176803" /><embed src="http://www.facebook.com/v/124990176803" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="400" height="300"></embed></object> is there a piece of html code i should add... either within this before it or after it? Im new to this stuff.. been on ages! Please help! Hello, Using the Greasemonkey script on Facebook, I was able to embed a video on my website. However, the code is not XHTML compliant (includes embed tags). The code is below. I've struggled trying to convert this into code using the object tag. is it possible? Can someone show me where I need to move each part of the existing code into an "object" based code? Thanks, Josh Code: <embed type="application/x-shockwave-flash" src="http://b.static.ak.fbcdn.net/swf/mvp.swf?7:136764" width="576" height="432" style="" id="so_mvp_swf_4962e86f49d3b2a98429149" name="so_mvp_swf_4962e86f49d3b2a98429149" bgcolor="#000000" quality="high" allowScriptAccess="always" scale="showall" allowFullScreen="true" wmode="window" flashvars="video_src=http%3A%2F%2Fvideo.ll.facebook.com%2Fvideo-ll-sf2p%2Fv1182%2F26%2F116%2F58389155428_4899.mp4&stage_width=756&stage_height=567&motion_log=%2Fvideo%2Fmotion_log.php&video_id=553535535428&video_length=408440&video_seconds=408&video_category=0&video_rotation=0&video_href=http%3A%2F%2Fwww.facebook.com%2Fvideo%2Fvideo.php%3Fv%3D58389155428&fbt_play_again=Play+Again&fbt_go_to_video=Go+to+Video&fbt_next_video=Next+Video&fbt_share=Share&video_player_type=video_player_permalink&video_width=756&video_height=567&slate_src=http%3A%2F%2Fstatic.ak.fbcdn.net%2Fswf%2Fmvp_slate.swf%3F7%3A134155&tail_slate_src=http%3A%2F%2Fstatic.ak.fbcdn.net%2Fswf%2Fmvp_tail_slate.swf%3F7%3A134155&next_video_url=http%3A%2F%2Fwww.facebook.com%2Fvideo%2Fvideo.php%3Fv%3D6637075428&video_owner_name=Becky+Draper-Vilimek&video_owner_href=http%3A%2F%2Fwww.facebook.com%2Fprofile.php%3Fid%3D6545535428&video_timestamp=Added+on+Thursday&video_title=Our+Wedding+-+September+13%2C+2008&thumb_url=http%3A%2F%2Fvthumb.ak.facebook.com%2Fvthumb-ak-sf2p%2Fv643%2F101%2F68%2F682235428%2Fb682244448_58389155428_1292.jpg&highqual_src=http%3A%2F%2Fvideo.ll.facebook.com%2Fvideo-ll-sf2p%2Fv247%2F26%2F116%2F58389155428_44340.mp4&lowqual_src=http%3A%2F%2Fvideo.ll.facebook.com%2Fvideo-ll-sf2p%2Fv1182%2F26%2F116%2F55355355428_4899.mp4&fbt_lowqual=View+in+Regular+Quality&fbt_highqual=View+in+High+Quality&highqual_is_on=1&string_table=http://static.ak.fbcdn.net/js_strings.php/t85501/en_US&swf_id=so_mvp_swf_4962e55435442a98429149"/> Hi there, I know nothing formal about HTML, hence the code below being converted from an Open Office file. Hopefully it is readable - it is some declarations, a body with maybe 10 links in it, and then an embedded video code from Exposure Room. I have the alignment how I want it, but the background-black in the body doesn't work any more. Is anyone able to show me how to keep the center alignments I have but also switch the background of the whole page to black? It works if I take out the <center> tags but then everything is left aligned, which I don't like. Any help would be appreciated, cheers, Tony Code: <?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN" "http://www.w3.org/TR/MathML2/dtd/xhtml-math11-f.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><!--This file was converted to xhtml by OpenOffice.org - see http://xml.openoffice.org/odf2xhtml for more info.--><head profile="http://dublincore.org/documents/dcmi-terms/"><meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8"/><title xml:lang="en-US">- no title specified</title><meta name="DCTERMS.title" content="" xml:lang="en-US"/><meta name="DCTERMS.language" content="en-US" scheme="DCTERMS.RFC4646"/><meta name="DCTERMS.source" content="http://xml.openoffice.org/odf2xhtml"/><meta name="DCTERMS.creator" content="Tony Wilkes"/><meta name="DCTERMS.issued" content="2011-04-17T19:59:38.83" scheme="DCTERMS.W3CDTF"/><meta name="DCTERMS.contributor" content="Tony Wilkes"/><meta name="DCTERMS.modified" content="2011-04-17T20:31:54.51" scheme="DCTERMS.W3CDTF"/><meta name="DCTERMS.provenance" content="" xml:lang="en-US"/><meta name="DCTERMS.subject" content="," xml:lang="en-US"/><link rel="schema.DC" href="http://purl.org/dc/elements/1.1/" hreflang="en"/><link rel="schema.DCTERMS" href="http://purl.org/dc/terms/" hreflang="en"/><link rel="schema.DCTYPE" href="http://purl.org/dc/dcmitype/" hreflang="en"/><link rel="schema.DCAM" href="http://purl.org/dc/dcam/" hreflang="en"/><base href="."/><style type="text/css">
@page { }
table { border-collapse:collapse; border-spacing:0; empty-cells:show }
td, th { vertical-align:top; font-size:12pt;}
h1, h2, h3, h4, h5, h6 { clear:both }
ol, ul { margin:0; padding:0;}
li { list-style: none; margin:0; padding:0;}
<!-- "li span.odfLiEnd" - IE 7 issue-->
li span. { clear: both; line-height:0; width:0; height:0; margin:0; padding:0; }
span.footnodeNumber { padding-right:1em; }
span.annotation_style_by_filter { font-size:95%; font-family:Arial; background-color:#fff000; margin:0; border:0; padding:0; }
* { margin:0;}
.P1 { font-size:12pt; font-family:Trebuchet MS; writing-mode:page; text-align:center ! important; color:#b3b3b3; }
.T2 { font-size:10pt; }
<!-- ODF styles with no properties representable as CSS -->
{ }
</style></head><center><body dir="ltr" style="max-width:21.001cm;margin-top:2cm; margin-bottom:2cm; margin-left:2cm; margin-right:2cm; background-color:#000000; "><p class="P1">Lying Down</p><p class="P1">*</p><p class="P1"><a href="http://www.lyingdown.co.uk/index.xhtml">Trailer</a> * <a href="http://www.lyingdown.co.uk/part1med">Part 1</a> * <a href="http://www.lyingdown.co.uk/part2med">Part 2</a> * <a href="http://www.lyingdown.co.uk/part3med">Part 3</a> * <a href="http://www.lyingdown.co.uk/part4med">Part 4</a> * <a href="http://www.lyingdown.co.uk/part5med">Part 5</a> * <a href="http://www.lyingdown.co.uk/part6med">Part 6</a> * <a href="http://www.lyingdown.co.uk/part7med">Part 7</a> * Download</p><p class="P1"><span class="T2"/></p><p class="P1"><a href="http://www.lyingdown.co.uk/indexlow"><span class="T2">Lowest quality</span></a><span class="T2"> * </span><a href="http://www.lyingdown.co.uk/indexhigh"><span class="T2">Highest Quality</span></a></p><p class="P1"><span class="T2"/></p><p class="P1">*</p>
<object id="xrPf8470a83ede543789fc18d1556be86e9" width="640" height="360" type="application/x-shockwave-flash" data="http://exposureroom.com/flash/XRVideoPlayer2.swf?domain=exposureroom.com/&assetId=f8470a83ede543789fc18d1556be86e9&size=md&titleColor=%23ffffff"><param name="movie" value="http://exposureroom.com/flash/XRVideoPlayer2.swf?domain=exposureroom.com/&assetId=f8470a83ede543789fc18d1556be86e9&size=md&titleColor=%23ffffff" /><param name="allowNetworking" value="all" /><param name="allowScriptAccess" value="always" /><param name="allowFullScreen" value="True" /><param name="wmode" value="opaque" /></object><div><div class="viewOnXRDiv"><a href="http://exposureroom.com/f8470a83ede543789fc18d1556be86e9" class="viewOnXRLink" title="Lying Down trailer by Tony Wilkes - View it on ExposureRoom" target="_blank">View on ExposureRoom</a></div></div>
</body></center>
</html>
Hi all, I have a long text without any space inside it. I want that it wrapped by the browser. Which code should I use? Thanks in advance. Hi, I'm working on an ecommerce website, my problem is that I cannot make some text in a cell wrap. Here's the details: The text in this particular cell is page numbers, and it is dynamically generated, so it changes depending on what the user selects in the shop. For example, if they are viewing a category that only has a couple pages of product, it's fine. But if they are viewing a category that has a couple hundred pages of product, the page number goes out horizontal in a straight line, and obviously causes some serious horizontal scrolling. I've tried setting a fixed width for the cell both in the <td> with width="whatever" and that didn't work, I tried setting it in the stylesheet with CSS but it still breaks the table. I just want it to wrap down a line when it gets to a certain width. Any ideas? First of all hope this is the right forum. I need to know how to wrap text so it flows around this twitter widget that I would like to place on my site in the center of page http://knowingabout.co.uk/bestinhulme/index.html. I have tried the usual way for an image but it doesnt seem to work. Below is a image and below that the actual code. <div id="twtr-search-widget"></div> <script src="http://widgets.twimg.com/j/1/widget.js"></script> <link href="http://widgets.twimg.com/j/1/widget.css" type="text/css" rel="stylesheet"> <script> new TWTR.Widget({ search: 'Manchester', id: 'twtr-search-widget', loop: true, title: 'Who\'s tweeting about...', subject: 'Manchester', width: 250, height: 280, theme: { shell: { background: '#887640', color: '#ffffff' }, tweets: { background: '#f3d2a5', color: '#444444', links: '#1985b5' } } }).render().start(); </script> Thx in advance I want to wrap a long line of text in a table for Firefox, IE 6, 7 and 8, Chrome and Opera. I try 'style="overflow:hidden; width:50px;' but the line is cut off. i.e. I see "longllllllllllllllllllllllllllllllllllllllllllll" but not "longlllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllll llllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllong". Code: <table border="1" cellpadding="2" cellspacing="0" width="600" style='table-layout:fixed'>
<col width=40>
<col width=97>
<tr valign="top">
<td align="center"><span class="Body2"><a href="index.jsp?ID=21">21<br>(22)</a></span></td>
<td style="overflow:hidden; width:50px; max-width:50px;"><a style="text-decoration: none" href="index.jsp?ID=21"><span class="bodySmall">longlllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllllong<br></span><span class="Body2"></span></a></td>
</tr>
</table>
Hi, I need to wrap the text of button so that it fits in the button's fixed width and doesn't expand the button's width, only it's height. This can be done in a regular text using the WORD-BREAK:BREAK-ALL; attribute But I tried this on the button and it's not working? Is there any work around for that? any css attribut? Hello, I am trying to display an image on the bottom left corner of the text. The text is dynamic. Below is a sample code(the text below is going to be dynamic). Please Advice? <style> .imgst { float:left; text-align:right; overflow:hidden; } </style> <table width="471" border="0" cellspacing="0" cellpadding="0"> <tr><td> <span class="imgst"><img align="baseline" align="top" src="/images/adams.jpg" /></span> lwekjrwekj rweklrjwerl lwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerllwekjrwekj rweklrjwerl </td> </tr> </table> Hey I'm trying to have this text surround this flash player but I can't get it to work, How can I do it? ::text:: My Chemical Romance Nine Inch Nails The Cure Taking Back Sunday The Used Emery Breaking Benjamin 30 Seconds To Mars The Spill Canvas Matchbook Romance Matchbox 20 Puddle of Mudd A Perfect Circle Seether Hoobastank Muse Atreyu Three Days Grace 3 Doors Down Audioslave Billy Talent Bloc Party Bloodhound Gang Blur Bush Cake Chevelle Coldplay Creed Death Cab For Cutie Deftones Faith No More Flyleaf Foo Fighters Garbage Goo Goo Dolls Green Day Incubus Interpol Jimmy Eat World Lifehouse Linkin Park Lostprophets Marilyn Manson Nickelback Nirvana Oasis Papa Roach Pearl Jam Placebo Queens Of The Stone Age REM Radiohead Rage Against The Machine Red Hot Chili Peppers Snow Patrol Soundgarden Staind Stone Temple Pilots System of a Down ♥ The Cranberries The Killers ♥ The Mars Volta The Offspring The Smashing Pumpkins The White Stripes U2 Weezer Yeah Yeah Yeahs Many More.. Emo Rock Alternative Gothic Screamo Pop :layer:: HTML Code: <p style="visibility:visible;"><object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" height="110" width="265" style="visibility:visible;width:265px;height:110px;" align="middle" border="0" data="http://assets.myflashfetish.com/swf/mp3/mff-pill.swf"> <param name="allowScriptAccess" value="never" /> <param name="allowNetworking" value="internal" /> <param name="movie" value="http://assets.myflashfetish.com/swf/mp3/mff-pill.swf" /> <param name="quality" value="high" /> <param name="wmode" value="transparent" /> <param name="flashvars" value="myid=13933683&path=2008/10/12&mycolor=FFFFFF&mycolor2=FFFFFF&mycolor3=c2878f&autoplay=false&rand=0&f=4&vol=100&pat=0&grad=false" /> </object></p> Hi there, I need some help with this page: I can't get the "In this section:" link list to go to the right of the body text of the page and have the body text wrap around it. I'm also having trouble getting all the different headings and paragraphs to work right -- even if I set the CSS to display:block; the different headings display as inline elements. To get around this I've had to assign them all a width of 860 px -- which I think might be contributing to the problem getting the link list to go to the right of the body text, but horizontally aligned with the top heading. Thanks for any help you can give! Michael Hi... I have two (hopefully simple) questions: First, is there any way to make a table resize automatically to fit a browser window regardless of the size of the window when the table contains images? I know how to make the table fit the window using <width="85%">, but that only works to a certain point. What I would like to have the image resize itself as the table shrinks. Is this possible? Also, How do I get text to wrap around an image. Like have the image in the upper left corner. Then the text would start at the top of the image directly to it's right and continue on to the bottom of the image. Then it would drop down below the image all the way to the images left edge. I hope I am asking this correctly. Thanks in advance! G'day guys, This will probably be a simple one for you. I have a table set to 150px, it has to be this width, and I need to have text indented in each cell. Trouble is, when the text wraps to the next line in the cell, it doesn't stay inline or indented. How do I get the text to stay indented when it travels to the next line? Thanks very much for any help you can give me. Cheers, Jamie |
|||||||