i've been using jquery succesfully with almost any browser but ie6, i'm giving up i wish i could use a conditional statement like
<!--[if IE 6]>
<link rel="stylesheet" type="text/css" href="css/style-for-ie.css" media="screen" />
<![endif]-->
To disable my scripts, is there anyway i can tell ie6 to stop loading something or to disable javascript altogether? or can i make a script.js for jquery that stops ie6 from loading certain functions?
I'm willing to use php to disable some code in my html if ie6 present, as long as is transparent to the user.
Thank you in advance
Use a downlevel-revealed conditional comment to place a class on the <body>:
<!--[if lt IE 7]><body class="ie6"><![endif]-->
<!--[if gte IE 7]><!--><body class="notie6"><!--<![endif]-->
Now you can target selectors at IE6 or not-IE6, from both stylesheets (so you don't necessarily have to use a separate stylesheet) and scripts (either checking the class of document.body manually, or just using selectors like $('body.notie6 div.something') in jQuery).
There are conditional comments directly in JScript too, but, annoyingly, they only target particular JScript engine version numbers, which don't always tie up with IE version numbers. Using the HTML conditional comments for everything makes it more consistent.
Related
I use JSF 2.3 for developing web application.
As a web developer, I care about the performance of loading speed of a site.
As I was exploring on how I could make my site faster, I encountered this post on Stack Overflow. And the quote from the accepted and most up-voted answer said
stylesheets should always be specified in the head of a document for better performance, it's important, where possible, that any external JS files that must be included in the head (such as those that write to the document) follow the stylesheets, to prevent delays in download time.
I know that JavaScript performs better when it is placed at the bottom of the <body>, but I want to include reCAPTCHA and Google instructs us to place the required external JavaScript before the closing </head> tag.
So, I decided to include the required external JavaScript before the closing </head> tag and after CSS files to boost the performance.
However, my CSS files are declared in a JSF way like <h:outputStylesheet name="css/default.css"/>, and I realized that the CSS files declared this way are always placed after files that are declared in a non-JSF way, which is <script src="https://www.google.com/recaptcha/api.js"></script>. I also considered making the external JavaScript behave in a JSF way by changing <script> to <h:outputScript>, but the <h:outputScript> can only render local scripts as described in this post .
So, the result will always be as follows.
<head>
<script src="https://www.google.com/recaptcha/api.js"></script>
<link type="text/css" rel="stylesheet" href="/project/javax.faces.resource/css/default.css.xhtml" />
</head>
insted of
<head>
<link type="text/css" rel="stylesheet" href="/project/javax.faces.resource/css/default.css.xhtml" />
<script src="https://www.google.com/recaptcha/api.js"></script>
</head>
Maybe I'm thinking too much, and the placement order of link and script doesn't affect the performance that much, but if the loading speed gets faster even a little, I want to follow the better way.
I searched online about the problem of using d3.js SVG under IE8, and I find an ideal method is using R2D3, and I tried to do like that, but it still doesn't work yet.
I am not sure what I have tried is right, do I only need to import the library like that?
<html>
<head>
<title>R2D3 101</title>
<!--[if lte IE 8]><script src="r2d3.js" charset="utf-8"></script><![endif]-->
<!--[if gte IE 9]><!-->
<script src="d3.js"></script>
<!--<![endif]-->
</head>
<body>
<h1>Hello, world!</h1>
</body>
</html>
And other things don't need to change? If you are interested, I can show you a simple demo about my treemap function.
http://jsfiddle.net/srvikram13/cR35x/9/
At first, I am thinking about if it is the problem of the limitations using Transforms as mentioned in the github: https://github.com/mhemesath/r2d3/
But the thing is, I really write the function as the GOOD one:
// BAD
circles.transform('translate(20)');
// GOOD
circles.transform('translate(20,0)');
How to use the comment like syntax for IE in html head tag? I specificaly mean this:
<!--[if lt IE 8]> <script src="json2.js"></script> <![endif]-->
As xpages uses for comments the same syntax as html standard, this comment is not rendered in browser ... any idea work workaround?
If you want to load specific resources (such as CSS or JS) only for IE versions up to and including 7, then you can do this in a theme:
<resource rendered="#{javascript:context.getUserAgent().isIE(0, 7) == true}">
<content-type>text/javascript</content-type>
<href>json2.js</href>
</resource>
Notice the context.getUserAgent().isIE() method that without parameters returns true for IE and with parameters returns true for specific versions of IE.
I use Dreamweaver to develop Web sites. I use the templates feature extensively as it helps to make things easier maintaining conformance.
However, I notice that Dreamweaver adds the following code before the doctype:
<!-- InstanceBegin template="/templates/web-public-user-home.dwt" codeOutsideHTMLIsLocked="false" -->
This is throwing my IE into Quirks mode for obvious reasons (i.e. comment before the doctype). Is there a way of dealing with this?! Below is my doctype.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Regards,
Ok, I figured this out.
Because of the extensive IE-compliance tweaking I'm doing, I was using conditional comments. However, I was using them on the html tag. There's nothing wrong with this in principle but Dreamweaver won't handle your live template updates properly when you do this (It will place the Dreamweaver-specific template lock code first before the doctype, thereby ensuring that your pages will throw Quirks mode in IE).
So what I did was move my conditional comment system away from the html tag, instead using them immediately after your opening body tag and immediately before your closing body tag like so:
<body>
<!--[if IE 6 ]> <div id="ie" class="ie6"> <![endif]-->
<!--[if IE 7 ]> <div id="ie" class="ie7"> <![endif]-->
<!--[if IE 8 ]> <div id="ie" class="ie8"> <![endif]-->
<!--[if gt IE 8 ]> <div id="ie"> <![endif]-->
<!--[if !IE]><div id="not-ie"> <![endif]-->
{YOUR HTML CODE}
</div>
</body>
This way, Dreamweaver places the doctype and html tag before the template lock code, and your resulting pages will appear in standards mode on IE (all things being normal).
Cheers.
Dreamweaver (incl. CS6) places the <!-- InstanceBegin template="... comment in front of the doctype tag only if it is unable to locate the opening <html> tag in your template! This happens when you forgot that tag altogether, but also when that tag is placed within conditional comments like this:
<!--[if IE 8]> <html class="ie8"> <![endif]-->
To avoid this you have to refrain from enclosing the <html> tag within conditional comments. When you use a normal undisguised <html> tag in your template code, Dreamweaver will automatically place the <!-- InstanceBegin template="... after that <html> tag in all files derived from that template and IE will not fall into quirks mode.
I'm working on a thumbnailer whereby a service takes thumbnail images of HTML content in a form-less IE9 control. Everything is working smoothly with a DrawToBitmap call along with a couple of GDI calls, but SVG content is not displaying. Everything else seems to display just fine, but no SVG.
I figure that this has something to do with how SVG is implemented in IE, but I don't know the details. Any thoughts?
TIA.
The answer came from Ted Johnson of IEBlog:
IE9 has no separate SVG engine; it’s all one DOM and rendering
pipeline. However, if your document isn’t in 9 standards document
mode, you’ll not get any SVG content. I think, by default, the
WebBrowser control in .NET defaults to compatibility mode. Try adding
a meta tag to the top of your HTML page to force IE9 mode:
<meta http-equiv="X-UA-Compatible" content="IE=9">
This, indeed, turned on SVG rendering like a light switch.
You can also set a doctype of HTML4 strict or HTML5.
<!DOCTYPE HTML>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
From http://www.seowarp.com/blog/2011/06/svg-scaling-problems-in-ie9-and-other-browsers/ :
Before I begin, I’d just like to point out that on my test page, Internet Explorer 9 refused to display any of my SVG images on a basic HTML page until I declared the HTML4 strict or HTML5 doctypes.