How To Create A Website Background Video In Adobe Edge ?

Hello,
I have video file in my computer SSD drive and i want it to play as background on my web page (page that i am creating).I did try to follow this video:
How To Create A Website Background Video In Adobe Edge Animate Using Edgehero - YouTube
but i cant follow 100% what he is doing.
Guide that i did try to follow is at this link: How To Create A Website Background Video In Adobe Edge Animate Using Edgehero - YouTube
Steps i do in Adobe Edge Animate CC
1.) Create New
2.) i click + sign under section Library >> Scripts >> Add JS File from URL...
URL that i am adding is: http://www.edgehero.com/edgehero.js/1.2/edgehero_1.2_min.js  (URL is taken from site: Edgehero.js )
I add this link: http://www.edgehero.com/edgehero.js/1.2/edgehero_1.2_min.js to box that occures after i click on Add JS File from URL
3.) I go to Edgehero.js and from there i scrol down to section named as Media - Html5 video / Html5 audio
and i select from there this:
there is a code:
  // this will set the video as background of the div/rectangle
backgroundvideo_1 ='movie.mp4';
  // put new edgehero.js variables here
4.) I go to Adobe Edge Animate CC 2014 and right click on project and select Open Actions for "Stage"
and then i click on + sign and select creationComplete
This will open Stage window
there i will copy this code:
  // this will set the video as background of the div/rectangle
backgroundvideo_1 ='movie.mp4';
  // put new edgehero.js variables here
5.) Then i click on ++ sign under library >> Video
and i add video from my computer SSD drive.
Video is named as video3.mp4
Now i eddit the code in Stage window (See above)
code will look after editing like this:
Then i change under left side px to %
6.) Then i copy backgroundvideo_1 from Stage Code:
Then i select Rectangle Tool and mark the area  (white box) and i click on small C icon
And the box that occures i type there backgroundvideo_1_mp4 autoplay
now when i use ctrl and enter i only get gray box that does not play video.
What am i doing wrong?

Here is the html file.
Note video file that i try to add is random training video from youtube, And file format is saved using this site:
How do I download and save a YouTube video to my computer?
this is only for testing as i am not gonna put that video on background to my web page. I am only trying to understand how to add video as background.
http://www.filedropper.com/test3_5
http://www.filedropper.com/test3_6
http://www.filedropper.com/test3edge
http://www.filedropper.com/test3edgeactions
http://www.filedropper.com/test3edgepreload
Goal is to create background video like u can see here:
Adobe Muse Tutorial - Responsive Design Hack! by MuseThemes.com - YouTube
Similar possibility is available also in Edge as i understand?

Similar Messages

  • Please tell me how to create a slider in the program Adobe Edge Reflow?

    Please tell me how to create a slider in the program Adobe Edge Reflow?

    There is no way to add animations in Reflow. If you want to add animation, then you can either use Muse which has many slider plugins to choose form or use the exported Reflow code in Brackets and add JavaScript for animating images there using various jquery plugins http://www.jssor.com/

  • How can I add a (youtube)video in Adobe Edge?

    I found this tutorial:
    https://www.youtube.com/watch?v=zCT0mHuXN90
    But the problem is that there is no "composition ready" in the action window anymore...
    So how can it be done?
    Regarrds

    IN Animate 'composition ready' event you're setting as the source of the iframe (the Youtube /watch page) doesn't want to be embedded in a page and thus you get  error
    "Refused to display 'http://www.youtube.com/watch?v=UDGRrxntWts&feature=youtu.be' in a frame because it set 'X-Frame-Options' to 'SAMEORIGIN'."
    You cannot force it to let you do that.
    The correct URL to embed in yoututbe is of the form:
    http://www.youtube.com/embed/oHg5SJYRHA0

  • How do I add mpg background video behind a psd menu in Encore?

    How do I add mpg background video behind a psd menu in Encore? The psd file is transparent and it still comes out as pitch black behind the menu. I'm inexperienced with these products so any help is greatly appreciated.

    If you have done what Russ describes and it does not work...
    Encore replaces the background layer with your motion video. So make sure you have a) a layer at the bottom (in Photoshop layer order) that is named "background," and b) no other full layer above that (for example, an image in another layer you've used instead of the original background layer).
    Also keep in mind that setting transparency in Photoshop is overridden by various Encore processes.

  • How to create a transport background for an applet ?

    HI can any one tell me the solution for this ...
    How to create a transport background for an applet ?
    please help
    -seenu_ch

    what does it mean to have a transparent background to an applet? transparent means you can "look through" it.
    What do you want to "look thorough" an applet.
    Sorry, I am still not understanding :(
    Please let me know what this means.
    regards,
    Sangeetha

  • How to create a Online Media (Video/Audio) Player using Flash

    How to create a video player, or an MP3 player using Flash? I want the player to play videos/songs which are hosted on the web (online player). A very common example is the Video Player used in Youtube to play the videos. How to create such a Online Video/MP3 player?

    You could start from the open source Strobe Media Playback and modify it to suit your needs.
    http://sourceforge.net/adobe/smp/home/Strobe%20Media%20Playback/

  • How to create a textured background

    Hi,
    I am very new to Java3D and I need help on how to create a textured background instead of using plain colors. I want to use a jpeg file for the background. Could anyone tell me a sample algorithm that will load this jpeg file and then set it up as the Scene's background?
    Thank you,
    Rubydium.

    What you want to do is create a background node and add an object textured on the inside. Here is a bit of sample code:
    BranchGroup bgGeometry = new BranchGroup();
    Appearance App = new Appearance();
    try {
       Texture tex = new TextureLoader(new java.net.URL(filePath+"yourTexture.jpg"), this).getTexture();
       App.setTexture(tex);
    catch (Exception e)
        e.printStackTrace();
    Sphere outerWorld = new Sphere( 1.0f, Primitive.GENERATE_TEXTURE_COORDS | Primitive.GENERATE_NORMALS_INWARD, App);
    bgGeometry.addChild(outerWorld); As you can probably tell, this is just creating a new BranchGroup and appearance and populating it with a sphere that displays it's appearance inwards.
    Background bg = new Background();
    bg.setApplicationBounds(bounds);
    bg.setGeometry(bgGeometry);
    objRoot.addChild(bg);

  • Embedding Video within Adobe Edge

    Hi
    I am trying to embed a video within Adobe Edge Animate. We had a solution which allowed us to place a video within a page and then click the video to expand to full screen. We have tried to use the code again but now that iOS6 has been installed the aniation crashes when the expand to full screen is clciked on the player.
    Does anyone know/have an edge example they can share
    Thanks in advance
    Andrew

    You cant.
    Emails are not the web and will never handle flash, scripting, videos etc.
    Other platforms will not do this either because its not a system feature, it is to do with how emails work.
    What you can do is have an image which links to a video on the web/page with video so people an view that.

  • How to create and share streaming video?

    Hi -
    I have finally finished a project in PE8 and I'd like to upload it to my website so that others can stream it.
    I have created output in FLV, MOV and MPG formats.
    I have uploaded them to my web server.
    However, whenever I link to the video, my browser (IE or Firefox) just asks to download or run it.
    Then, it tries to download the entire video - this is a problem as the files are up to 1.3gb.
    I've tried this:
    <html>
    <a href="myvideo.flv">CLICK HERE</a>
    </html>
    and this:
    <OBJECT CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"
    CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab" WIDTH="160" HEIGHT="136" >
    <PARAM NAME="src" VALUE="myvideo.mov" >
    <PARAM NAME="autoplay" VALUE="true" >
    <EMBED SRC="myvideo.mov" TYPE="image/x-macpaint"
    PLUGINSPAGE="http://www.apple.com/quicktime/download" WIDTH="160" HEIGHT="136" AUTOPLAY="true"></EMBED>
    </OBJECT>
    and this:
    <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="400" height="400" >
    <param name="movie" value="myvideo.flv">
    <param name="quality" value="high" >
    <param name="LOOP" value="false">
    <embed src="myvideo.flv" width="400" height="400" loop="false" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"></ embed >
    </ object >
    So, why isn't it streaming?
    Is it the video format?
    The embedding on the web page?
    My server?
    Perhaps you can share the details of how you created and setup a streaming video?
    Thanks....

    You need to embed a player for the file. This will differ by the file type that you choose. I'd probably go with a Flash player, but you have other choices.
    I'd post your request for the exact instructions, and HTML code needed, plus tips on optimization to the Muvipix "Community," probably under the "Water Cooler" sub-forum. The Webmaster there, Ron, is an expert in embedded players, as are several other subscribers. I'll bet that you'll get the exact code, with all sorts of useful tweaks, in no time. If Ron suggests another file type and player, listen to him, and not to me. I just deliver the streaming AV files in the exact format that my client asks for. They have their Webmaster use them in their particular page design. My job ends, before your's, now, begins.
    Good luck,
    Hunt

  • Website Background Video

    Hi I have seen a few websites that have video's as there backgrounds. Some of them are very impressive. How can I do that with my website.
    If I purchase the video what format should I purchase and how could I put this on my site?

    Isn't natively supported in Muse at this time but have a look at this thread for a few suggestions and tips on how to go about doing it - http://forums.adobe.com/thread/1213057.
    Thanks,
    Vinayak

  • How to create a playlist for videos

    Hey guys pls help me; how to create a video playlist on Mac?

    Hello TibosForZan
    You can do it 2 different ways. The first is just creating a blank playlist and then navigate to the videos, then click and drag the videos and a menu on the right hand side will appear and choose that playlist. The other method involves enabling the side bar and the creating a blank playlist, then navigating to the videos and drag and drop the videos that you want. The article below about creating playlist will apply to videos as well.
    iTunes 11: Frequently used features
    http://support.apple.com/kb/HT5649
    iTunes 11 for Mac: Create a playlist
    http://support.apple.com/kb/PH12140
    Regards,
    -Norm G.

  • How to create a Faded background

    I'm using Fireworks CS3.
    I have created a new canvas and saved it as a .png. I now want to create a faded background. So I select the gradient tool and define the details of the color, etc BUT when I mouseover the canvas I get a circle with a slash through it pointer and I'm unable to apply the gradient.
    What do I need to do with a new canvas before i can start applying the gradient tool to it?
    Thank you kindly!

    The canvas is just that - a canvas. You need to draw a rectangle shape on the canvas using the vector tools, and use the gradient on the rectangle.
    Jim Babbage

  • How to create one-to-one video chat?

    Hi,
    I want to create one-to-one video chat facility for a demo
    project of mine, but being total noob, I cannot find any pointers.
    Can anybody help?
    Thanks
    Vijay G.

    try this one!!! I use it... its good!!!
    http://www.flash-db.com/Tutorials/privchat/
    or
    http://www.flash-db.com/Tutorials/privchat/PrivChat.php?
    See ya!

  • How to create the subtitle for video

    I have been working on the editing and was wondering how to make the subtitles into it?  Can some one recommend a easy software to use?  Thank you.

    Dear Umesh,
    How Bom created for co product
    By product
    Header
    xxx
    101
    mvt
    mvt
    qty
    item
    yyy
    261
    1
    zzz
    531
    0.5-
    By product
    Same way how we create co product for BOM. pl explain with simple example.
    Thanks &regards,
    Sabhapathy R

  • How to create a facebook "likes" counter in adobe after effects?

    I was wondering if anyone could guide me to a tutorial on how to create a small icon that updates for example, the number of steps a person has taken or how many likes a video has got. For an example, I want to shoot a video where someone is running and I use a device which monitors my steps. The device shows the steps as 2 running shoes and in my video I would like to have this icon with the steps being counted beside it in my video.

    My approach would be to take a screen grab of the look you want, in the highest resolution possible.  Rebuild and adjust what you need, either in Photoshop or After Effects.
    To create a counter that steps up numerically, you can either use a text layer with an expression to keyframe the numbers, or create a solid and apply the Numbers plugin, which also allows you to keyframe the numbers.
    Here's some options straight from a Google search: after effects number counter
    If you're seeking a tool that will automatically count the steps of the person walking/running, that's a very complex proposition.

Maybe you are looking for