So I am embedding the music like so (testing in firefox),
<object width="300" height="20">
<param name="src" value="music/Furrow.mp3">
<param name="autoplay" value="false">
<param name="controller" value="true">
<param name="bgcolor" value="#FFFFFF">
<embed src="music/Furrow.mp3" autostart="false" loop="false" width="300" height="42" controller="true" bgcolor="#FFFFFF">
When I load my html pages, there is a little VLC type player, which is perfect. However I have an issue, the player looks like this when i take my mouse off the player,
http://imgur.com/3aCGfx0
How can I change the orange cone + black background to have lets say, album artwork or a picture?
Thanks
PS this might not be the best way to add music, but I am just trying to work out the album artwork for now
The way your doing it is using a default plugin provided by your browser. In your case, this is VLC, but this depends on the client media plugin.
What you have to do is using a custom media player (you know have choice between flash, html5, or so ...), and manage the artwork by your own.
Look at existing solution such as subsonic, ampache ...
Example screenshot form subsonic : there is a little embed flash player, and playlist + artwork is handled with javascript.
To begin with, should know your source code, perhaps a picture to absolute position for the cone icon in CSS.
ps : JW player offers solutions with playlist and album art, always with flash player.
http://www.longtailvideo.com/jw-player/download/
Related
I've got a webpage which works with a MySQLi DB (this is a private website just for our company and it is not something global). Now, I want to upload some videos on server (and not on the DB) and put their links on the website. Now, here is my question: How can I make browser to open Windows Media Player (after clicking on each link by a user) and play the video on the computer, and not on the browser??
As a matter of fact, I do not want the browser to show my videos to users, I want each user to watch videos by Windows Media Player on their computers.
I think a simple should work in your html
video link
I video should download, depending on your users prefrences the video may open after its finished downloading... you can't force this
If you want stream then this embed should work:
<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="http://www.yoursite.com/your-video.wmv">
<param name='animationatStart' value='true'>
<param name='transparentatStart' value='true'>
<param name='autoStart' value="false">
<param name='showControls' value="true">
<param name='loop' value="true">
<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="http://www.yoursite.com/your-video.wmv" autostart="true" designtimesp='5311' loop="true">
</embed>
</object>
Note:
You would be better off using html5 tags and converting to mp4 - not that many people use windows media player these days
I bought this flying birds MOV file from istockphotos and now I'm stuck trying to implement it into my webpage, I want it to run like a flash file, every few seconds but I can't seem to be able to import it into Adobe Flash, I tried using the code below but it does not allow me to do much and is not transparent:
<OBJECT classid='clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B' width="320"
height="255" codebase='http://www.apple.com/qtactivex/qtplugin.cab'>
<param name='src' value="ad.mov">
<param name='autoplay' value="true">
<param name='controller' value="false">
<param name='loop' value="false">
<EMBED src="iStock_000011342270Small We.mov" width="320" height="255" autoplay="true"
controller="false" loop="false" pluginspage='http://www.apple.com/quicktime/download/'>
</EMBED>
</OBJECT>
The person who created the stock wrote this on his site:
Alpha Mattes and Luma Mattes
Some of the clips contain alpha or luma mattes. If you don't know how
to use these, search online and discover their uses as masks. I've
heard from people who have converted my footage to use in Flash and
have successfully used the luma mattes there too. The black and white
clips of the birds can used as luma mattes, so the birds can be placed
on any background of your choice. As mentioned above, if you're using
After Effects, any of the clips can be used with the free Knoll
"UnMult" plugin which removes the black from the clips by creating an
alpha channel - it works really well with the rain and smoke clips.
I don't understand what a luma matte is, maybe someone can point me in the right direction?
There didn't seem to be a way to fix this issue, I ended up making the video transparent myself using Adobe After Effects and a great tutorial using Keying, it wasn't the best but it did the trick
I am trying to embed a video on a website which will be used as an intro. Im interested in a way of embeding that video without a control bar (play,pause...). I can convert it to any format as I have the project file so compability isnt an issue. I have tried inserting it with tag in HTML5 and that works seamlessly but because of a bug in Chrome white color in the video becomes gray and that doesnt work for me because video background has to be white so it can be camouflaged with the rest of the website.
Interesting. I haven't seen the Chrome/white issue, but from the sounds of it... it's just in dev versions of Chrome? I'm basing this off the last comment from this post.
Looks like there was a patch, and it's waiting to be merged.
Not sure if these help in terms of using HTML5's video tag. If you don't care about the tag, you could always go with a Flash-based version using an .mp4 file. That way, whenever you're comfortable with Chrome's rendering... you could set it back up with the video tag.
Again, if you're ok with using Flash... you could pull it off like so (using Flowplayer):
<object width="600" height="338" type="application/x-shockwave-flash" data="http://whywouldyouclickthat.com/flowplayer/flowplayer-3.2.7.swf">
<param name="movie" value="http://whywouldyouclickthat.com/flowplayer/flowplayer-3.2.7.swf" />
<param name="allowfullscreen" value="true" />
<param name="flashvars" value='config={"clip": {"url": "/yourDirectory/yourMovie.mp4", "autoPlay":true, "autoBuffering":true},"plugins": {"controls": null}}' />
</object>
Again, not sure if Flash is a deal-breaker here.
I would think there would be a simple param for embedded videos to show a volume control but I cannot seem to find anything except stuff on controlling the systems volume using jquery. Is there a way to just enable the built in volume control of an embedded video?
If I use this code to embed the video is there a way to enable the volume control of the player?
<object 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" width="220">
<param name="fileName" value="URL of my Video">
<param name="autoStart" value="false">
<param name="showControls" value="true">
<embed type="application/x-mplayer2" pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" src="URL of my video" width=220 autoStart=0 showcontrols=1>
</object>
yes there is. and apparently you added it for two players. i dunno whether the parametes are correct, but this embedding teqnique is really out of date and will not be supported for as many clients as video could be.
you should check out the html5 video tag, the next best alternative (imo) is flash.
have a look at this article: http://camendesign.com/code/video_for_everybody
i'm developing a web where i want to show a flash on the index page. The flash got 3Mb size. But while it is downloading, i just see a white space where it should be.
I have tried putting an image in the background, but i just see white until the flash is fully downloaded...
Any tip? I would like to see the first image of the flash, or an static image while it is loading?
im just putting it in the direct way
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="899" height="138">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="899" height="138">
<param name="movie" value="FELIPE.swf" />
<param name="quality" value="high" />
<embed src="FELIPE.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="899" height="138"></embed>
</object>
Depending on your environment, flex, flex builder, flash, etc, the method will be different. But what you are looking for is a 'preloader'. You move all your resources out of the first frame and move it to the second frame, the movie will load the first frame fast, display your 'loading message', then stop, and actionscript runs checking for the load progress of the swf, when it is complete, it advances to the second frame and plays your movie.