I am using a moving flash logo on my website. I am using the code below:
<object width="248px" height="148px" id="flashContent">
<param name="movie" value="http://domain.co.uk/flash/Flash_logo.swf">
<param name="wmode" value="transparent" />
<object type="application/x-shockwave-flash" data="http://domain.co.uk/flash/Flash_logo.swf" width="248px" height="148px">
<param name="movie" value="http://domain.co.uk/flash/Flash_logo.swf">
<param name="wmode" value="transparent" />
<img src="images/global/logo.png"/>
</object>
</object>
Basically the code above will show the flash logo unless flash is not available.In which case the image logo.png will be used as a replacement. This works perfectly fine. However problems arise with Firefox when it detects that flash is not up to date.
Instead of showing the flash file or the logo.png firefox displays a big box stating that the plugin is vulnerable and must be updated. To be honest my flash files serves not other function that to add a little extra style to the site and with the plugin problem my site loads without a logo at all which is less than ideal.
I suppose my question is... Is it possible to edit my code above so that if the plug in is out of date then just the logo.png is loaded instead of Firefox detecting the plugin problem?
First of all, it is not just Firefox and/or outdated Flash.
Users can set any plugin incl. Flash to click-to-play in recent Firefox versions, not just outdated ones.
Chrome also has a preference that allows you to set plugins to "click-to-play".
There is no reliable way to detect click-to-play (due to outdated plugins and/or user preferences), neither in Firefox nor Chrome.
Sometimes it is recommended to construct a plugin in javascript, wait for it to load and then try to interact with it, and if that fails go to a fallback method. However, you still cannot distinguish between the plugin being autoloaded and the user just being a fast clicker.
Your best option is not to use Flash at all, if you don't really need it or it doesn't worth the fuzz. Otherwise try the detection thing.
Related
I have been trying playing rtsp source files in my web page. I have googled it on net and found that adding VLC activex plugin can do the trick. i have used following code to achieve this and its working so far ..
<object classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921"
codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab"
width="640" height="480" id="vlc" events="True">
<param name="Src" value="rtmp://192.168.0.102/vod/20141022_162503.mp4" />
<param name="ShowDisplay" value="True" />
<param name="AutoLoop" value="False" />
<param name="AutoPlay" value="False" />
</object>
Now I just want to improve the look and feel of the player. Is there is any way I can add some skin files to it or by some other way.
Vlc Web Plugins has no skinnig capabilities. Absolutely.
So if you need something like this, you have following options:
Dig into Vlc Web Plugins sources and implement what you need (very long way);
Use Vlc Web Plugins with enabled windowless mode and create UI over plugin window with html (way with very poor perfomance, and not working with Vlc ActiveX);
Use FBVLC or WebChimera (in FBVLC compatibility mode) and enabled windowless mode, and create UI same way as in (2). Still will have poor perfomance, but at least it will work on IE;
Use WebChimera and write any UI you like wihout any perfomance penalties - this project was created exactly to solve this task;
If you want to know what WebChimera is - just google it, you will find it on the first page of seach output.
P.S.: WebChimera based on libvlc and supports Win/Mac/Linux platforms
I've a Windows Media Player box on me page, but...
The Windows Media Player will overlap every peace of html code how can I get it to the back and that I can still use it? And my second problem is that everybody that visit my page needed a plugin for loading it, but veryone has Windows Media Player installed on his PC? Who can help me and explain something :< Thanks already :D
<object id='mediaplayer' classid='clsid:6bf52a52-394a-11d3-b153-00c04f79faa6' type='application/x-oleobject' width='100%' height='150px'>
<param name='url' value='SONG.mp3'/>
<param name='autostart' value='1'/>
<param name='showcontrols' value='1'/>
<param name='stretchtofit' value='0'/>
<param name='enablecontextmenu' value='0'/>
<param name='ShowStatusBar' value='1'>
<embed src='SONG.mp3' width='100%' height='150px' autostart='1' type='application/x-
mplayer2' pluginspage='http://www.microsoft.com/Windows/MediaPlayer/'
transparentatstart='0' animationatstart='0' showcontrols='1' autosize='0' displaysize='0'
showtracker='0' ShowStatusBar='1'></embed>
The first part of your question is difficult to answer without some sample code to work with.
I would recommend added a presized container div to hold the player in your desired location on the page.
To answer the senond part of your question.
Embedding media player in your webpage means users will be executing the file through their web browser. A plugin for the users specific browser is required to play back the files.
This is standalone from windows media player and will allow users who do not have media player to play the files from their desired browser and operating system.
If you want people to use there installed media player then a link to download the file and execute it on their own computer is required.
I am having an issue in WordPress. I've embedded a .swf as an object, but in IE 8 it shows really small. I've attached a screenshot of the IE issue. It's that really small picture on the left. To see a working version, check out the page here on another browser.
I would love to disregard this issue, but unfortunately our company runs on IE so I need to fix this.
This is all created in WordPress. The .swf is hosted externally. Here is the code:
<object width="680px" height="300px">
<param name="movie" value="http://www.pplweb.com/ppl-generation/~/media/PPLWeb/Generation/Media/PPL%20Susquehanna/nuclear.swf">
<embed src="http://www.pplweb.com/ppl-generation/~/media/PPLWeb/Generation/Media/PPL%20Susquehanna/nuclear.swf" width="100" height="100">
</embed>
</object>
Embed it using SWFObject, it's the most reliable way to insert SWF files. WordPress already comes bundled with it, so you just need wp_enqueue_script('swfobject');, and then use the script embedding accordingly.
Or you can use a plugin: wordpress.org/plugins/search.php?q=swfobject.
I have an object loading a flash animation with an image as a fallback.
When I look at the resources being loaded on page load, the fallback image appears to be downloaded regardless of whether or not flash is detected, which seems to be wasteful and inefficient (especially if the fallback image is large).
What's a clean way to ensure the fallback image isn't loaded if the object tag detects flash?
I've already looked at the get_browser() PHP function and it doesn't appear to be a viable option.
Here's a code outline:
<object>
<param name="movie" value="..." />
<param name="play" value="true" />
<div id="frontpagefallback">
<img src="..." width="..." alt="..." usemap="#homeMap" />
</div>
</object>
I'm assuming that you have this image in place in the div or whatever, and that you repopulate this div with the Flash content, if Flash is available. If so, yes, the behavior you are seeing is normal.
What you need to do is determine in Javascript if Flash is installed, and then decide whether to populate that div with the image content, or the Flash content. How you do this depends on how you are loading the flash. I believe SWFObject can do this for you.
Generally though, it is fine to put that image there by default. What if someone loads your page that isn't capable of running your Javascript to detect flash? What about non-browsers on your page, such as search engines?
While embedding a SWF in HTML is not too hard, there are a few subtleties for different browsers, detecting if Flash is installed, etc.
For enabling AJAX, there are standard chunks of code you can use to save the hassle of coping with all cases... is their a similar 'reference implementation' to embed a SWF which covers all the bases?
Is there a standard? Sadly no. The desirable points of a Flash embedding method are:
modern browser compatible
IE compatible
ancient browser compatible
standards-compliant
supporting streamed Flash (play before the whole file is downloaded) in IE
Don't Repeat Yourself
allow fallback content
no JavaScript reliance
but there is no one bunch of markup that satisfies all these points. Point 6 is impossible to achieve fully but some solutions fail worse than others.
About the simplest markup you can get away with is the version outlined in the classic Flash Satay article:
<object type="application/x-shockwave-flash" data="file.swf" width="x" height="y">
<param name="movie" value="file.swf" />
(Non-Flash content here)
</object>
The ALA article complains that this version won't prompt the user to download Flash if it isn't installed; personally I see this as a plus point. But it still fails on points 3 and 5. Point 5 may or may not matter: if your Flash file is a simple application, media player or loader stub it doesn't matter at all, but if it's a big animation it can be unfortunate.
Maybe point 3 doesn't matter any more; no-one's really using Netscape 4 or IE4 these days. But if it does to you, you need the old-school embed tag. This is also supported by modern browsers so that means you can use the ActiveX method for the outer object, so you get streaming in IE:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="x" height="y">
<param name="movie" value="file.swf" />
<embed type="application/x-shockwave-flash" src="file.swf" width="x" height="y" />
</object>
This is the ‘traditional’ method of embedding Flash. It fails on points 4 and 7 and is slightly worse on point 6.
The third approach, used by libraries such as SWFObject is to use JavaScript to choose the best way to instantiate Flash on the current browser. This can hit the all the above points except, naturally, 8. Some libraries offer ways to mitigate that by also including static object markup, trading point 8 for point 6.
Apple (Link for example)
Content that your plug-ins will view
needs to be embedded within HTML. Most
browsers do this with an EMBED tag,
but others require the OBJECT tag. For
maximum compatibility, you can tune
your page to support both.
Adobe (Link for example)
The OBJECT tag is used by Internet
Explorer on Windows and the EMBED is
used by Netscape Navigator (Macintosh
and Windows) and Internet Explorer
(Macintosh) to direct the browser to
load the Macromedia Flash Player.
Internet Explorer on Windows uses an
ActiveX control to play Macromedia
Flash content while all other browser
and platform combinations use the
Netscape plugin technology to play
Macromedia Flash content. This
explains the need for two tags.
<OBJECT classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/
shockwave/cabs/flash/swflash.cab#version=6,0,40,0"
WIDTH="550"
HEIGHT="400"
id="myMovieName">
<PARAM NAME=movie VALUE="myFlashMovie.swf">
<PARAM NAME=quality VALUE=high>
<PARAM NAME=bgcolor VALUE=#FFFFFF>
<EMBED href="/support/flash/ts/documents/myFlashMovie.swf"
quality=high
bgcolor=#FFFFFF
WIDTH="550"
HEIGHT="400"
NAME="myMovieName"
ALIGN=""
TYPE="application/x-shockwave-flash"
PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
</EMBED>
</OBJECT>
Many implementations of Flash embedding seem to be based on SWFObject. Is this the kind of thing you are looking for? Edit: project is hosted here now
I would recommend SWF Object compared to all the other options because it produces Standards Compliant html and is really easy to setup.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<div id="myvideo"></div>
<script type="text/javascript">
var params = { allowScriptAccess: "always" };
var atts = { id: "myplayerid1" };
swfobject.embedSWF("http://www.youtube.com/v/gRvUpoTT-Bo&hl=pt-br&fs=1&enablejsapi=1&playerapiid=myplayerid1&version=3", "myvideo", "425", "344", "8", null, null, params, atts);
</script>
This might be the easy way ..use js fiddle to test any code ... that helped me a lot to try many things