scratch/output/Scratch/en/blog/2009-10-30-How-to-handle-evil-IE/index.html
Yann Esposito 70314df976 Recompiled
2012-05-02 17:43:56 +02:00

227 lines
No EOL
10 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="keywords" content="web, webdesign, jQuery">
<link rel="shortcut icon" type="image/x-icon" href="/Scratch/img/favicon.ico" />
<link rel="stylesheet" type="text/css" href="/Scratch/assets/css/main.css" />
<link rel="stylesheet" type="text/css" href="/Scratch/css/solarized.css" />
<link rel="stylesheet" type="text/css" href="/Scratch/css/idc.css" />
<link href='http://fonts.googleapis.com/css?family=Inconsolata' rel='stylesheet' type='text/css'>
<link rel="alternate" type="application/rss+xml" title="RSS" href="http://feeds.feedburner.com/yannespositocomen"/>
<link rel="alternate" lang="fr" xml:lang="fr" title="Une CSS pour IE seulement" type="text/html" hreflang="fr" href="/Scratch/fr/blog/2009-10-30-How-to-handle-evil-IE/" />
<link rel="alternate" lang="en" xml:lang="en" title="How to handle evil IE" type="text/html" hreflang="en" href="/Scratch/en/blog/2009-10-30-How-to-handle-evil-IE/" />
<script type="text/javascript" src="/Scratch/js/jquery-1.3.1.min.js"></script>
<script type="text/javascript" src="/Scratch/js/jquery.cookie.js"></script>
<script type="text/javascript" src="/Scratch/js/index.js"></script>
<script type="text/javascript" src="/Scratch/js/highlight/highlight.pack.js"></script>
<script type="text/javascript" src="/Scratch/js/article.js"></script>
<!--[if lt IE 9]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
<![endif]-->
<title>How to handle evil IE</title>
</head>
<body lang="en" class="article">
<script type="text/javascript">// <![CDATA[
document.write('<div id="blackpage"><img src="/Scratch/img/loading.gif" alt="loading..."/></div>');
// ]]>
</script>
<div id="content">
<div id="choix">
<div class="return"><a href="#entete">&darr; Menu &darr;</a></div>
<div id="choixlang">
<a href="/Scratch/fr/blog/2009-10-30-How-to-handle-evil-IE/" onclick="setLanguage('fr')">en Français</a>
</div>
<div class="flush"></div>
</div>
<div id="titre">
<h1>
How to handle evil IE
</h1>
</div>
<div class="flush"></div>
<div class="flush"></div>
<div id="afterheader">
<div class="corps">
<p>For developer IE is a nightmare. This is why, I use a method to disable my standard CSS and enable a IE only CSS. I use jQuery to accomplish that.</p>
<div>
<pre><code class="javascript">$(document).ready( function() {
if ($.browser["msie"]) {
// include the ie.js file
$('head').append('&lt;script type="text/javascript" src="/js/ie.js"&gt;&lt;/scr' + 'ipt&gt;');
}
});
</code></pre>
</div>
<div><div class="codefile"><a href="/Scratch/en/blog/2009-10-30-How-to-handle-evil-IE/code/ie.js">&#x27A5; ie.js</a></div>
<pre><code class="javascript">// Remove all CSS I don't want to use on IE
$('link[rel=stylesheet]').each(function(i)
{
if (this.getAttribute('href') == '/css/layout.css')
this.disabled = true;
if (this.getAttribute('href') == '/css/shadows.css')
this.disabled = true;
if (this.getAttribute('href') == '/css/gen.css')
this.disabled = true;
}) ;
// Append the CSS for IE only
$('head').append('&lt;link rel="stylesheet" type="text/css" href="/css/ie.css"/&gt;');
// I also add a message on top of the page
$('body').prepend('&lt;div id="iemessage"&gt;&lt;p&gt;&lt;span class="fr"&gt;&lt;em&gt;Avec &lt;a href="http://www.firefox.com"&gt; Firefox &lt;/a&gt; et &lt;a href="http://www.apple.com/safari"&gt;Safari&lt;/a&gt; cette page est bien plus jolie !&lt;/em&gt;&lt;/span&gt;&lt;span class="en"&gt;&lt;em&gt;This page is far nicer with &lt;a href="http://www.firefox.com"&gt; Firefox &lt;/a&gt; and &lt;a href="http://www.apple.com/safari"&gt;Safari&lt;/a&gt;!&lt;/em&gt;&lt;/span&gt;&lt;/p&gt;.&lt;/div&gt;');
</code></pre>
</div>
<p>Thats it.</p>
</div>
<div id="social">
<div class="left"> <a href="https://twitter.com/share" class="twitter-share-button" data-via="yogsototh">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</div>
<div class="left"> <div class="g-plusone" data-size="medium" data-annotation="inline" data-width="106"></div>
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
</div>
<div class="flush"></div>
</div>
<div id="choixrss">
<a id="rss" href="http://feeds.feedburner.com/yannespositocomen">
Subscribe
</a>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('#comment').hide();
$('#clickcomment').click(showComments);
});
function showComments() {
$('#comment').show();
$('#clickcomment').fadeOut();
}
document.write('<div id="clickcomment">Comments &amp; Share</div>');
</script>
<div class="flush"></div>
<div class="corps" id="comment">
<h2 class="first">comments</h2>
<noscript>
You must enable javascript to comment.
</noscript>
<script type="text/javascript">
var idcomments_acct = 'a307f0044511ff1b5cfca573fc0a52e7';
var idcomments_post_id = '/Scratch/en/blog/2009-10-30-How-to-handle-evil-IE/';
var idcomments_post_url = 'http://yannesposito.com/Scratch/en/blog/2009-10-30-How-to-handle-evil-IE/';
</script>
<span id="IDCommentsPostTitle" style="display:none"></span>
<script type='text/javascript' src='/Scratch/js/genericCommentWrapperV2.js'></script>
</div>
<div id="entete" class="corps_spaced">
<div id="liens">
<ul><li><a href="/Scratch/en/">Home</a></li>
<li><a href="/Scratch/en/blog/">Blog</a></li>
<li><a href="/Scratch/en/softwares/">Softwares</a></li>
<li><a href="/Scratch/en/about/">About</a></li></ul>
</div>
<div class="flush"></div>
<hr/>
<div id="next_before_articles">
<div id="previous_articles">
previous entries
<div class="previous_article">
<a href="/Scratch/en/blog/2009-10-28-custom-website-synchronisation-with-mobileme--2-/"><span class="nicer">«</span>&nbsp;custom website synchronisation with mobileme (2)</a>
</div>
<div class="previous_article">
<a href="/Scratch/en/blog/2009-10-Wait-to-hide-a-menu-in-jQuery/"><span class="nicer">«</span>&nbsp;Menu waiting to hide himself</a>
</div>
<div class="previous_article">
<a href="/Scratch/en/blog/2009-10-launch-daemon-from-command-line/"><span class="nicer">«</span>&nbsp;launch daemon from command line</a>
</div>
</div>
<div id="next_articles">
next entries
<div class="next_article">
<a href="/Scratch/en/blog/2009-11-12-Git-for-n00b/">Git for n00b&nbsp;<span class="nicer">»</span></a>
</div>
<div class="next_article">
<a href="/Scratch/en/blog/2009-12-06-iphone-call-filter/">iphone call filter&nbsp;<span class="nicer">»</span></a>
</div>
<div class="next_article">
<a href="/Scratch/en/blog/2009-12-14-Git-vs--Bzr/">Git vs. Bzr&nbsp;<span class="nicer">»</span></a>
</div>
</div>
<div class="flush"></div>
</div>
</div>
<div id="bottom">
<div>
<a href="https://twitter.com/yogsototh">Follow @yogsototh</a>
</div>
<div>
<a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/">Copyright ©, Yann Esposito</a>
</div>
<div id="lastmod">
Created: 10/30/2009
Modified: 05/09/2010
</div>
<div>
Entirely done with
<a href="http://www.vim.org">Vim</a>
and
<a href="http://nanoc.stoneship.org">nanoc</a>
</div>
</div>
<div class="clear"></div>
</div>
</body>
</html>