I converted my SWF to HTML5 using Google's SWIFFY. THis works fine on FF and other Browsers, however I get an Error in IE9. Weird, cause the Google release page says it supports IE9.
Is there a way of getting around this?
I was thinking of doing a fallback to SWF Flash Player for IE Only. Also not sure how to do this. If anyone can help me to solve this problem that would be great.
Much Appreciated!!!
Here's the Code from the HTML5 File (Standard to all other SWIFFY HTML Files):
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Swiffy output</title>
<script src="https://www.gstatic.com/swiffy/v5.3/runtime.js"></script>
<script>
swiffyobject = {"internedStrings": [
"::::::::","::::::6Y:","::::::7E:","::::::9S:","RrRrRr::","::::::5H:","::::::8B:",
"::::::1Q:","::::::8L:","::::::2N:","::::::8V:","::::::4K:","DdDdDd::",
"5C5c5C5c5C5c::","::::::0J................................
</script>
<style>html, body {width: 100%; height: 100%}</style>
</head>
<body style="margin: 0; overflow: hidden">
<div id="swiffycontainer" style="width: 711px; height: 661px">
</div>
<script>
var stage = new swiffy.Stage(document.getElementById('swiffycontainer'),
swiffyobject);
stage.start();
</script>
</body>
</html>
Google's docs actually currently claim that support is only IE10+.
To use a flash fallback I would simply use IE conditional comments. Only include the swiffy javascript if the browser is IE10+ (<!--[if gt IE 9]><!--> ... <!--<![endif]-->), and fallback to embedding the SWF files directly by wrapping their HTML in <!--[if lte IE 9]> ... <![endif]-->.
Related
Below is my piece of code that work's in all the browser in all the OS, except ipad chrome. Help me out here.
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<script>
function myprint() {
const wnd = window.open('about:blank', '', '_blank, alwaysRaised=yes');
wnd.document.write('<html><head><title></title>');
wnd.document.write('</head><body>');
wnd.document.write('<div>JavaScript often abbreviated as JS, is a high-level, interpreted programming language. It is a language which is also characterized as dynamic, weakly typed, prototype-based and multi-paradigm.</div>');
wnd.document.write('<div class="print-header"><button title="Print" onclick="window.print()">Print</button></div>');
wnd.document.write('</body></html>');
wnd.document.close();
}
</script>
<body>
<button onclick="myprint()">popup</button>
</body>
</html>
Here Im trying to open my content using window.open() then print them using window.print(). That's all. jsfiddle
This link also not working in ipad chrome.
Print
This is an issue with Chrome on iOS. Because of Apple’s policy on third party browsers, Chrome is actually just a WebView component. Printing is currently not supported. As far as I am aware, there is currently no workaround for this issue.
Try this code, if it not works another solution is to use a third-party printing service like this: http://www.printfriendly.com
function goPrint(){
window.print();
if(navigator.userAgent.toLowerCase().indexOf('chrome') > -1) {
window.location.reload();
}
}
You are using a backtick character ` in this line:
wnd.document.write(`<div class="print-header"><button title="Print" onclick="window.print()">Print</button></div>`);
This is a Templated literal and might not be supported. Try replacing it with a single quote:
wnd.document.write('<div class="print-header"><button title="Print" onclick="window.print()">Print</button></div>');
I am implementing application which should support async video recording, and I started just exploring Ziggeo, cool thing is that it supports WebRTC and I wanted to use this. Below is the quick start application. Everything works fine on Chrome and FF but on Opera I get the following error Could not read video file with status code 412, any ideas what might cause this error?
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="//assets-cdn.ziggeo.com/v1-stable/ziggeo.css" />
</head>
<body>
<button onclick="startVideoRecording()">Start video</button>
<div id="video">
</div>
<script src="//assets-cdn.ziggeo.com/v1-stable/ziggeo.js"></script>
<script>ZiggeoApi.token = "MY-TOKEN-IS-HERE";</script>
<script>ZiggeoApi.Config.cdn = true;</script>
<script>ZiggeoApi.Config.webrtc = true;</script>
<script>
function startVideoRecording() {
console.log('recording');
recorder = ZiggeoApi.Embed.embed('#video', {
limit: 15,
width: 770,
height: 557,
});
}
</script>
</body>
</html>
This is resolved in the latest release of the JS SDK on Ziggeo - that is "v1-r10"
To use it, you can simply change the header in your code to call the same as so:
<link rel="stylesheet" href="//assets-cdn.ziggeo.com/v1-r10/ziggeo.css" />
<script src="//assets-cdn.ziggeo.com/v1-r10/ziggeo.js"></script>
UPDATE (May 2016)
Updating this post to reflect the fact that v1-r10 is currently the stable version, so it is better if stable version is called instead of a specific version (as you will get all the latest stable versions including their upgrades and fixes).
This is done using the following code:
<link rel="stylesheet" href="//assets-cdn.ziggeo.com/v1-stable/ziggeo.css" />
<script src="//assets-cdn.ziggeo.com/v1-stable/ziggeo.js"></script>
I have a web page that originally had embedded JavaScript within a script section, and it worked fine when served up with a simple http server.
I now want to put my JavaScript, which manipulates SVG elements, in separate files, and as a first try, I put it all in a singe .js file:
<!DOCTYPE html>
<meta charset="UTF-8">
<title>Some Graphics With SVG</title>
<head>
<meta http-equiv="refresh" content="5">
<style>
#svgContainer {
width: 2188px;
height: 1312px;
background-color: "white";
}
</style>
<script src="all.js"></script>
</head>
<body onload="resagui()">
<div id="svgContainer"></div>
</body>
I should note that the JavaScript function resagui appears at the top of all.js:
function resagui() {
...
}
Everything works great when I test this locally and view the page with file:///... from my browser. But when I try http://ipaddress:port it does not work.
I know that this is not a network issue, as the html file with embedded JavaScript works fine when I try http://ipaddress:port
My Firefox browser console provides two errors:
SyntaxError: expected expression, got '<'
and
ReferenceError: resagui is not defined
The html looks well formed, and there is no '<' character in my .js file.
Thanks for any insight you can provide.
Jay
I am having problem loading my application page with dojo 1.9 in IE8. It works flawlessly from IE9 onwards and on firefox as well as chrome.
The error thrown in console is "LOG: Exception in Callback: Error: Member not found" and sometimes " 'mid' is null or not an object " and the page stops rendering.
The HTML is:
<!DOCTYPE html>
<html>
<head>
<style> #import "../../../Scripts/dojolib/release/dijit/themes/claro/claro.css"; #import "../../../Scripts/dojolib/release/dijit/themes/dijit.css"; #import "../../../Scripts/dojolib/release/dgrid/css/dgrid.css"; </style><style type="text/css"> body { autofocus:false; } </style><meta charset="utf-8">
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
<title>XYZ</title>
<link rel="stylesheet" href="../css/app-min.css">
<link rel="stylesheet" href="../css/systemsettings.css" />
<link rel="stylesheet" href="../css/pageLayout.css">
<link rel="stylesheet" href="../css/X420_style.css">
<script src='../../../Scripts/gw-app-config.js'></script><script src='../../../Scripts/dojolib/release/dojo/dojo.js'></script><script src='../scripts/gw-app.js'></script></head>
<body class="claro" >
<div id="maincontainer" class="container" style="width:1200px; margin: 0 auto; overflow: hidden; display: block;">
<div id="body" class="row">
<div class="wrapper">
<div id="topBanner" data-dojo-type = "dijit/layout/ContentPane"></div>
<div id="topMenu" data-dojo-type = "dijit/layout/ContentPane"></div>
<div id="content" data-dojo-type = "dijit/layout/ContentPane"></div>
<div id="footer" data-dojo-type = "dijit/layout/ContentPane"></div>
</div>
</div>
</div>
</body>
</html>
Please tell me what can possibly go wrong in IE8 and how can I debug this issue?
Even though you have posted what looks like the whole page, it's impossible to test as we don't know where is e.g. dojoConfig specified. I believe it's in gw-app-config.js file, but what else is in there?
In regards of your problem, the first thing I've noticed is that your meta tags are not on top of hierarchy, they should be right after the head tag. That would be the first advice to test.
Please see this link and the second answer, that might not be the same problem as yours, but similar
X-UA-Compatible is set to IE=edge, but it still doesn't stop Compatibility Mode
I solved this after a lot of debugging in the same way belzebu had highlighted. IE8 broke on each and every Dojo statement in which Dojo was applying CSS styling for IE8 unsupported CSS fields (like background, linear gradient).
I also eliminated use of dom.byId() and used style.set()
I also replaced CSS with the one supported by IE8 and other browsers.
I am trying to access a public-facing site (not one that I developed but is being used as a reference site) and it does not load in IE8 (which is our corporate standard browser). It loads fine in Chrome (not all users have it). The error I receive is "res://ieframe.dll/acr_error.htm...". Do I have to configure IE8 in some way to render this? Any and all assistance to better troubleshoot this would be greatly appreciated.
I looked at the source via "View source" and I see the following towards the top:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.css" />
<link rel="stylesheet" type="text/css" href="/css/mobile.css" />
<link rel="stylesheet" type="text/css" href="/css/main.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="/js/plugins/jquery.scroll.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).bind("mobileinit", function(){
$.extend( $.mobile , {
ajaxFormsEnabled : false,
ajaxLinksEnabled : false
});
});
</script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"></script>
Does the above code snippet suffice to assist with some advice or is the whole HTML document needed?
I think you need to start by wrapping that in a
$(document).ready(function{
});
segment, otherwise you may run into all sorts of trouble.
unfortunately your question is too vague to get you a reliable answer, however a quick google search landed me on this:
http://answers.microsoft.com/en-us/ie/forum/ie8-windows_other/resieframedll-error-in-ie-8/7f657540-474f-4587-b661-c3ffbb1aed06
So I am suspecting it's a problem with your installation of ie8. If not please supply more info :)
I doubt jQuery Mobile has much support for IE8. It's built with mobile browsers in mind so the main rendering engines would be Webkit(Chrome) and Gecko(Fx). It's that simple.
JQuery mobile is supported by IE 8 if it is the correct version, but this line here may be the error:
<script type="text/javascript" charset="utf-8">
$(document).bind("mobileinit", function(){
$.extend( $.mobile , {
ajaxFormsEnabled : false,
ajaxLinksEnabled : false
});
});
</script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"></script>
You are calling something with mobile before your mobile script is imported. You need to first import your mobile script, then do a document.ready() call a Javascript function at the VERY END of you html page that will run all init functions.
This is one of the few calls you want to run before loading JQuery Mobile
//run this script after jQuery loads, but before jQuery Mobile loads, and may help solve your issue
//customize jQuery Mobile to let IE7+ in (Mobile IE)
$(document).bind("mobileinit", function(){
$.extend( $.mobile , {
//extend gradeA qualifier to include IE7+
gradeA: function(){
//IE version check by James Padolsey, modified by jdalton - from http://gist.github.com/527683
var ie = (function() {
var v = 3, div = document.createElement('div'), a = div.all || [];
while (div.innerHTML = '<!--[if gt IE '+(++v)+']><br><![endif]-->', a[0]);
return v > 4 ? v : !v;
}());
//must either support media queries or be IE7+
return $.support.mediaquery || (ie && ie >= 7);
}
});
});