Web application R&D notes, from the world of Java, Flex, CSS, XHTML, Flash, .NET, cross-browser compatibility, JavaScript, AJAX, ADA compliance, Photoshop, and any and all things related to Web development!
22 November 2010
Switch to Office 2003 menus in Office 2007, 2010
This nifty program (free for personal use) enables Office 2003 menus in Office 2007 and 2010.
18 November 2010
17 November 2010
15 November 2010
Getting JW HTML5 Player to work on IE, Part II
In part 1, we talked about getting the player working on IE with the beta version of the JW HTML5 Player. Now that version 1.0 of the JW Player is out, let's revisit the issue of getting it working on various browsers, including IE.
First off, the full release has a different syntax for initialization of the player. This code demonstrates how to set up the player for all video tags on the page as well as for IE. Don't forget to include the jwplayer.js file on the page.
Note that in the version I was using, there was a bug in Firefox: FF doesn't like the console object being called when without the Firebug window being open. IE has the console object available by default. So if you set debug: "console", you might get errors on Firefox.
In addition, when creating your video tags, ensure that the MP4 source tag comes before OGV: Chrome chokes if you have OGV first, perhaps because it can play both video types via its HTML5 implementation. Also note the event handlers attached to the video player; these are called for the AnythingSlider to stop and start.
First off, the full release has a different syntax for initialization of the player. This code demonstrates how to set up the player for all video tags on the page as well as for IE. Don't forget to include the jwplayer.js file on the page.
$(document).ready(function(){You should try the above code without the if (jQuery.browser.msie){...} to see if it works for you on IE; it didn't for me so I've thrown that in. The code pulls the MP4/M4V video source and applies it to the main video tag as a src attribute. This took quite a bit of trial-and-error to discover.
$("video").each(function(){
if (jQuery.browser.msie){
var vidFile = "";
$(this).parent().find("source").each(function(){
if (jQuery(this).attr("src").indexOf("m4v") != -1 ||
jQuery(this).attr("src").indexOf("mp4") != -1){
vidFile = jQuery(this).attr("src"); //.substring(jQuery(this).attr("src").lastIndexOf("/")+1);
//alert("vidFile: " +vidFile);
}
$(this).remove();
});
$("[id="+$(this).attr("id")+"]").attr("src",vidFile);
}
jwplayer($(this).attr("id")).setup({
events: {
onPlay: function() {videoEventHandler(1)},
onComplete: function() {videoEventHandler(0)}
},
//debug: "console",
players:
[
{ type: "html5" },
{ type: "flash", src: "global/vid/player.swf" }
],
components: {
controlbar: {
position: 'bottom'
}
}
});
});
});
function videoEventHandler(type){
switch(type){
case 1:
stopSlider();
break;
case 0:
startSlider();
break;
default:
return;
}
}
Note that in the version I was using, there was a bug in Firefox: FF doesn't like the console object being called when without the Firebug window being open. IE has the console object available by default. So if you set debug: "console", you might get errors on Firefox.
In addition, when creating your video tags, ensure that the MP4 source tag comes before OGV: Chrome chokes if you have OGV first, perhaps because it can play both video types via its HTML5 implementation. Also note the event handlers attached to the video player; these are called for the AnythingSlider to stop and start.
09 November 2010
08 November 2010
04 November 2010
01 November 2010
Subscribe to:
Posts (Atom)