JavaScript - Hi, I Currently Created A Video Uploader, But When The Video Is Too Big In Size, The

Is it possible to have a thumbnail of a video, then when you click it it expands so you can watch it without having to link to a different page? I'm thinking kind of like how people link youtube videos on facebook

Hi
I am trying to create a pop up window to view a video stream but it's not working. When I click on the image the pop up window doesn't appear. I have an oscMax site (this is oscommerce with more bells and whistles).
This is my html code on my index page:
Code:

<td align="right" valign="middle"><a href="javascript:openNewWindow_01_01();"><img src="templates/my_custom/images/play_video.jpg" alt="Video Tutorial." border="0" width="50" height="20"></a></td>

And this is my attempt at the javascript. I inserted it into my stylesheet but I'm not sure if this is the correct place for it.
Code:

</style>
<script language="Javascript" type="text/javascript">
<!--
function openNewWindow_01_01() {
window.open('http://buildawebsite.ie/store/catalog/flix/01_01/01_01.html', 'name', 'height=400,resizable=yes,width=600');
}
</script>

Any suggestions would be a great help. Thanks.

Hello everyone, after a few days of looking i give up i just don't know what to look for or how to do it.

on this website "http://www.hunlock.com/blogs/Everything_You_Ever_Needed_To_Know_About_Video_Embedding there is a section called How to make a video select list. I have been able to replicate and modify it to my liking how ever i have one issue. i can't make my videos fullscreen. The videos have and give the option for full screen but the fullscreen doesn't work.

i prefer this kind of code because it allows my webpage to select a video without changing the webpage and play it, i find it much more smoother then then multiple embedded videos in tabs (i don't even know what to call it so thats what i call it)

just incase the website doesnt work or something i will post the script

first part<div id='videoPlayback' style='width: 435px; height:350px; background-color: #800000;'></div>

then

<div id='selectDemo1' style='display: none'>
<object width="425" height="350">
<param name="movie" value="http://www.youtube.com/v/-is63goeBgc"></param>
<param name="wmode" value="transparent"></param>
<embed src="http://www.youtube.com/v/-is63goeBgc&autoplay=1"
type="application/x-shockwave-flash" wmode="transparent"
width="425" height="350">
</embed>
</object>
</div>

<div id='selectDemo2' style='display: none'>
<object width="425" height="350">
<param name="movie" value="http://www.youtube.com/v/c6SHsF1n9Qw"></param>
<param name="wmode" value="transparent"></param>
<embed src="http://www.youtube.com/v/c6SHsF1n9Qw&autoplay=1"
type="application/x-shockwave-flash" wmode="transparent"
width="425" height="350">
</embed>
</object>
</div>

then
<A HREF="#" onclick='return playVideo("selectDemo1","videoPlayback")'>RvD2: Ryan vs. Dorkman 2</A><BR>
<A HREF="#" onclick='return playVideo("selectDemo2","videoPlayback")'>Beatboxing Flute </A><BR>

and finally<script type="text/javascript">
function playVideo(sourceId, targetId) {
if (typeof(sourceId)=='string') {sourceId=document.getElementById(sourceId);}
if (typeof(targetId)=='string') {targetId=document.getElementById(targetId);}
targetId.innerHTML=sourceId.innerHTML;
return false;
}
</script>

i'm not sure the exact functions or how to write this kinda stuff from scratch so if you have any helpfull additions or suggestions please let me know.

Hi all,
I need help with my problem. I have a plasma TV on which I invoking a lot of different short videos and I need at this TV also displayed a particular Web page. Video length is variable and depends on the actual length of the video currently playing and display the Web page is always 3 minutes.
I'd like to do in this format:
video1.html (3 minutes) -> pocasi.cz (5 minutes) -> video2.html (10 minutes) -> pocasi.cz (5 minutes)->...-> video30.html (1,5 minutes) -> pocasi.cz (5 minutes) -> video1.html (2,5 minutes )->... . Video's and web page in full screen without buttons.
Can someone please advise how the script should look like?
Thank you for your advice.

Hi all,
How can I insert ads on html5 video tag before the main video plays?
Now, I need make a sample allow:
- play first advertisment video
- play second ad video
- play main video
after 10 mins (half of duration) . pause main video . and play ad video.
after that. continue the main video playback.

Can you help me please?
Thank you very much!

Hi everyone. I'm new to the forum, and in need of help.

The code below sometimes works the way I want it to...by downloading a video from an external site and displaying a placeholder whenever the page loads. But most of the time, the video won't download and display until a user hovers their mouse over the blank area.

Is it possible to modify the code so that it functions consistently by always downloading and displaying the placeholder when the page loads? I don't want users to think there's a missing/broken video because there's a blank space where the video is supposed to be, and they don't realize they have to mouse over it.

I would be grateful for any pointers. I searched the forums for a solution, but I don't think I'm using the correct keywords. Thanks so much for your help.

Code:

<a href="#" onclick="return(false);" rel="videoGUID=4cd75af679b39g4963V828c00c581024ae86&" style="display: block; width: 550px; height: 310px" id="4cd75af679b39g4963V828c00c581024ae86" width="550" height="310">How to Take Care of Your Dog's Teeth: VetVid Episode 001</a><script type="text/javascript" src="http://360.sorensonmedia.com/4cd75af679b39g4963V828c00c581024ae86/embedv2.js"></script>

I would like multiple videos one one page. I tried to give each one an individual id but failed miserably. Also how on earth do I assign a image to each player. My example works with one player only and falls back to HTML5 video with no problems . If I decided on five videos per page, how do I apply an id to each one as well as a different image per player. Here is what I have so far:

Code:

<script type="text/javascript" src="video/swfobject.js"></script> 
<script type="text/javascript"> 
var flashvars = {}; 
flashvars.src = "http://www.mysite.com.mp4"; 
flashvars.controlBarMode = "floating"; 
flashvars.poster = "http://mysite.com/imageonplayer.png"; 

var params = {}; 
params.allowfullscreen = "true"; 
params.allowscriptaccess = "always"; 

var attributes = {}; 
attributes.id = "videoDiv"; 
attributes.name = "myDynamicContent"; 

swfobject.embedSWF("http://fpdownload.adobe.com/strobe/FlashMediaPlayback.swf", "videoDiv", "487", "275", "10.1.0","expressInstall.swf", flashvars, params, attributes); 
</script> 
</head>

Code:

<div id="videoDiv"> 
<video controls="controls" poster="http://mysite.com/imageonplayer.png" width="487" height="275"> 
<source src="http://www.mysite.com/mymovie.mp4" type="video/mp4" /> 
<source src="http://www.mysite.com/mymovie.ogg" type="video/ogg" /> 
</video> 
</div>

I assigned each player an individual id like this as suggested on another thread but that didn't work. Any suggestions? :
Code:

<script type="text/javascript"> 
swfobject.registerObject("videoDiv1", "10.1.0"); 
swfobject.registerObject("videoDiv2", "10.1.0"); 
swfobject.registerObject("videoDiv3", "10.1.0"); 
swfobject.registerObject("videoDiv4", "10.1.0"); 
</script>

Thanks
Dan

01) I would like to rollover (onmouseover?) a button that is a video and have the video (button) play. (A 5 sec video that stops at end)

02) On rolloff (onmouseoff?) the same button I would like it to rewind to the beginning for next rollover.

03) I would like to add more of these "Video Button Rollovers" to the same website page in the future. I would like to use DreamWeaver CS4, and stay away from flash for more accessibility and less memory intensive overhead. (obviously no control-bar for video)
-----
I have all the parts to this to try a variety of solutions.
-----
-The video is a box with untied string on a white background.
- When played a person fades-on and ties the string into a bow.
(white background matches website background)
-----
Parts:
01) video from untied box to tied box with person .mov
02) image of first frame of video .jpg
03) video from untied box to tied box with person to person fade-off and untied box .mov
04) video of tied box with person to person fade-off and untied box.mov
-----
The parts will be on this website: http://mydata.salve.edu/emersonb/g2/media.html

Thanks

I want to run a flash video on my web site. I've been working on this for days now, and obviously missing something.

The page is really BRIEF -- nothing more than <object> calls and swfobject.registerObject call.

when I look at it on the server, I get a totally blank page in IE. In firefox, I see a little "block" tab where the movie frame would be if it worked.

Here is the whole code:

thanks so much for looking at it.

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">
<head>
<LINK REL="SHORTCUT ICON" HREF="http://olympiceq.com/favicon.ico">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Olympic Equine</title>
</head>

<body> 
 
  
        <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="360" height="264" id="FLVPlayer">
          <param name="movie" value="FLVPlayer_Progressive.swf" />
          <param name="quality" value="high" />
          <param name="wmode" value="opaque" />
          <param name="scale" value="noscale" />
          <param name="salign" value="lt" />
          <param name="FlashVars" value="&amp;MM_ComponentVersion=1&amp;skinName=Corona_Skin_2&amp;streamName=HorseswithClicktoPlay&amp;autoPlay=false&amp;autoRewind=false" />
          <param name="swfversion" value="8,0,0,0" />
          <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
          <param name="expressinstall" value="expressInstall.swf" />
         
		  <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
          <!--[if !IE]>-->
          <object type="application/x-shockwave-flash" data="FLVPlayer_Progressive.swf" width="360" height="264">
            <!--<![endif]-->
            <param name="quality" value="high" />
            <param name="wmode" value="opaque" />
            <param name="scale" value="noscale" />
            <param name="salign" value="lt" />
            <param name="FlashVars" value="&amp;MM_ComponentVersion=1&amp;skinName=Corona_Skin_2&amp;streamName=HorseswithClicktoPlay&amp;autoPlay=false&amp;autoRewind=false" />
            <param name="swfversion" value="8,0,0,0" />
            <param name="expressinstall" value="expressInstall.swf" />
           
		    <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
            <div>
              <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
              <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>
            
			<!--[if !IE]>-->
          </object>
          <!--<![endif]-->
        </object>
    
<script type="text/javascript">
<!--
swfobject.registerObject("FLVPlayer");
//-->
</script>

</body>
</html>

I am new to javascript (I started learning it today) so please explain it for newbies.

I am trying to get the amount of video (in seconds) buffered already by the client and the whole duration of the video.

Then, I divide them to get the precentage which was buffered so far.

I have no problem storing the durating using:
Code:

var duration = document.getElementById('vid').duration

- returns "12.6" (seconds)


I am struggling with getting the buffered time. I tried:
Code:

var buffered = document.getElementById('vid').buffered

This one returns "[object TimeRanges]".
From what I understood this is some kind of an object (Like an array?).
I tried returning "buffered.length" and I get "1" back.

Please explain how I can do this. thanks

I am using joomla, and have a tabbed menu at the top, which has different articles embedded within. I have embedded a flash video inside each article. The problem is that if i play a video and then switch to the other tab (article) without pausing the video, the video keeps on playing. And if i try to play the video in the other article, then both videos start playing.

I want to stop the first video from playing as soon as I switch to the new tab. There are a lot of different files which are included in the page, so If I know where to place a particular code within the source of the final rendered webpage, I will be able to place it at the right point in a particular file.

thanks

the website link is: http://tinyurl.com/ycg4tcm

I want to encrypt my video file and wants to give source url of that file in my web page and while before playing of that file on my web page I want enable password for authentication.
How to do this? (Using javascript or html5 )

Hello guys,

I spent a lot of time searching for a good image/video gallery, but didn't find, what I'm looking for.

All I need is a code, that I can insert to my webpage. I need a thumbnail gallery (images or videos), that I can scroll by next/previous buttons a open it by clicking in new window. This is how LightBox and VideoLightBox work, but they don't have the next/previous buttons. I found js ImageScroller, but it can't work together with VideoLightBox...

Is there anybody solving this problem? Well I found this page
http://codecanyon.net/item/jquery-ho...preview/112734
but I need it even for videos. If there is a solution for both images and videos...

Thanks for help, DveD

I have a website where I am using a numbers counter and on the same page I have a video, I can't get both of them to work on the same page, Only one will work which is the numbers ticker. I have setup an example of it on a page, you can see he http://www.wordpressconnect.net/testing.php

you can see the numbers ticker but at the bottom you can't see the video load.

I have tested it with just the video and it works by itself.

Is anyone able to help out pleaseeeeee, I've never coded javascript before so Im not sure how to fix this.

thank youu

I am trying to mimic the video mouseover preview which can be viewed at the website below once you put your mouse over a picture a video preview window is opened which plays back the video and stops once the mouse is moved.

http://videocopilot.net/tutorials/

How can i mimic this effect... any suggestions?