<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Daniel Tome's blog &#187; Internet Explorer</title>
	<atom:link href="http://www.danieltome.com/blog/category/internet-explorer/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.danieltome.com/blog</link>
	<description>Flash, PHP, Open Source, Actionscript, Australia and Argentina stuff.</description>
	<lastBuildDate>Tue, 18 Nov 2008 00:48:06 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.4</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Disable options in a multiple select &#8211; Javascript for IE</title>
		<link>http://www.danieltome.com/blog/2007/08/16/disable-options-in-a-multiple-select-javascript-for-ie/</link>
		<comments>http://www.danieltome.com/blog/2007/08/16/disable-options-in-a-multiple-select-javascript-for-ie/#comments</comments>
		<pubDate>Wed, 15 Aug 2007 16:40:26 +0000</pubDate>
		<dc:creator>Danno</dc:creator>
				<category><![CDATA[Annoyances]]></category>
		<category><![CDATA[Crossbrowser]]></category>
		<category><![CDATA[Firefox]]></category>
		<category><![CDATA[Internet Explorer]]></category>
		<category><![CDATA[Javascript]]></category>

		<guid isPermaLink="false">http://www.danieltome.com/blog/2007/08/16/disable-options-in-a-multiple-select-javascript-for-ie/</guid>
		<description><![CDATA[Yeah, you might be amazed if you thought that just setting the option to disabled would work, even in IE7.
But it looks like it only works on proper browsers.
I searched the net everywhere to see how other people were doing it and I found this method (from: www.lattimore.id.au) to be the best one for my [...]]]></description>
			<content:encoded><![CDATA[<p>Yeah, you might be amazed if you thought that just setting the option to disabled would work, even in IE7.<br />
But it looks like it only works on proper browsers.</p>
<p>I searched the net everywhere to see how other people were doing it and I found <a href="http://www.lattimore.id.au/2005/07/01/select-option-disabled-and-the-javascript-solution/" title="Select, Option, Disabled And The JavaScript Solution" target="_blank">this method</a> (from: <a href="http://www.lattimore.id.au/">www.lattimore.id.au</a>) to be the best one for my needs. I made some updates to it: I was using a multiple select list and also because I was creating the select box from an AJAX response. So here&#8217;s the code:</p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1">&nbsp;</div>
</li>
<li class="li1">
<div class="de1"><span class="kw2">function</span> emulateDisabled<span class="br0">&#40;</span>selectBox<span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;<span class="kw1">for</span> <span class="br0">&#40;</span><span class="kw2">var</span> i=<span class="nu0">0</span>, option; option = selectBox.<span class="me1">options</span><span class="br0">&#91;</span>i<span class="br0">&#93;</span>; i++<span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;<span class="kw1">if</span> <span class="br0">&#40;</span>option.<span class="me1">disabled</span><span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li2">
<div class="de2">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; option.<span class="me1">style</span>.<span class="me1">color</span> = <span class="st0">&quot;graytext&quot;</span>;</div>
</li>
<li class="li1">
<div class="de1">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;<span class="br0">&#125;</span><span class="kw1">else</span><span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; option.<span class="me1">style</span>.<span class="me1">color</span> = <span class="st0">&quot;menutext&quot;</span>;</div>
</li>
<li class="li1">
<div class="de1">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;<span class="br0">&#125;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;<span class="br0">&#125;</span></div>
</li>
<li class="li2">
<div class="de2"><span class="br0">&#125;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;</div>
</li>
<li class="li1">
<div class="de1"><span class="kw2">function</span> restoreEmulateDisabled<span class="br0">&#40;</span>selectBox<span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;<span class="kw1">for</span> <span class="br0">&#40;</span><span class="kw2">var</span> i=<span class="nu0">0</span>, option; option = selectBox.<span class="me1">options</span><span class="br0">&#91;</span>i<span class="br0">&#93;</span>; i++<span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;<span class="kw1">if</span><span class="br0">&#40;</span>option.<span class="me1">selected</span> &amp;amp;&amp;amp; option.<span class="me1">disabled</span><span class="br0">&#41;</span><span class="br0">&#123;</span></div>
</li>
<li class="li2">
<div class="de2">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; option.<span class="me1">selected</span>=<span class="kw2">false</span>;</div>
</li>
<li class="li1">
<div class="de1">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;<span class="br0">&#125;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;<span class="br0">&#125;</span></div>
</li>
<li class="li1">
<div class="de1"><span class="br0">&#125;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;</div>
</li>
<li class="li2">
<div class="de2"><span class="kw2">function</span> addEmulation<span class="br0">&#40;</span>selectBox<span class="br0">&#41;</span><span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;window.<span class="me1">select_current</span> = <span class="kw2">new</span> Array<span class="br0">&#40;</span><span class="br0">&#41;</span>;</div>
</li>
<li class="li1">
<div class="de1">&nbsp;selectBox.<span class="kw3">onfocus</span> = <span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span><span class="br0">&#123;</span> window.<span class="me1">select_current</span><span class="br0">&#91;</span><span class="kw1">this</span>.<span class="me1">id</span><span class="br0">&#93;</span> = <span class="kw1">this</span>.<span class="me1">selectedIndex</span>; <span class="br0">&#125;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;selectBox.<span class="me1">onchange</span> = <span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span><span class="br0">&#123;</span> restoreEmulateDisabled<span class="br0">&#40;</span><span class="kw1">this</span><span class="br0">&#41;</span>; <span class="br0">&#125;</span></div>
</li>
<li class="li1">
<div class="de1"><span class="br0">&#125;</span></div>
</li>
<li class="li2">
<div class="de2">&nbsp;</div>
</li>
</ol>
</div>
<p>If you are generating your select element with AJAX, just call <code>emulateDisabled(your_select_box);</code><br />
 on the onComplete function.<br />
If you would like to have all your select elements to have this functionality then add this onload function:</p>
<div class="dean_ch" style="white-space: wrap;">
<ol>
<li class="li1">
<div class="de1">&nbsp;</div>
</li>
<li class="li1">
<div class="de1">window.<span class="kw3">onload</span> = <span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;<span class="kw1">if</span> <span class="br0">&#40;</span>document.<span class="me1">getElementsByTagName</span><span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;<span class="kw2">var</span> s = document.<span class="me1">getElementsByTagName</span><span class="br0">&#40;</span><span class="st0">&quot;select&quot;</span><span class="br0">&#41;</span>;</div>
</li>
<li class="li2">
<div class="de2">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;<span class="kw1">if</span> <span class="br0">&#40;</span>s.<span class="me1">length</span> &gt; <span class="nu0">0</span><span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; window.<span class="me1">select_current</span> = <span class="kw2">new</span> Array<span class="br0">&#40;</span><span class="br0">&#41;</span>;</div>
</li>
<li class="li1">
<div class="de1">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; <span class="kw1">for</span> <span class="br0">&#40;</span><span class="kw2">var</span> i=<span class="nu0">0</span>, select; select = s<span class="br0">&#91;</span>i<span class="br0">&#93;</span>; i++<span class="br0">&#41;</span> <span class="br0">&#123;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; select.<span class="kw3">onfocus</span> = <span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span><span class="br0">&#123;</span> window.<span class="me1">select_current</span><span class="br0">&#91;</span><span class="kw1">this</span>.<span class="me1">id</span><span class="br0">&#93;</span> = <span class="kw1">this</span>.<span class="me1">selectedIndex</span>; <span class="br0">&#125;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; select.<span class="me1">onchange</span> = <span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span><span class="br0">&#123;</span> restoreEmulateDisabled<span class="br0">&#40;</span><span class="kw1">this</span><span class="br0">&#41;</span>; <span class="br0">&#125;</span></div>
</li>
<li class="li2">
<div class="de2">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; emulateDisabled<span class="br0">&#40;</span>select<span class="br0">&#41;</span>;</div>
</li>
<li class="li1">
<div class="de1">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;&nbsp; &nbsp; &nbsp; &nbsp; <span class="br0">&#125;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;<span class="br0">&#125;</span></div>
</li>
<li class="li1">
<div class="de1">&nbsp;<span class="br0">&#125;</span></div>
</li>
<li class="li1">
<div class="de1"><span class="br0">&#125;</span></div>
</li>
<li class="li2">
<div class="de2">&nbsp;</div>
</li>
</ol>
</div>
<p>A big thanks to the guy from lattimore.<br />
cheers mate.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.danieltome.com/blog/2007/08/16/disable-options-in-a-multiple-select-javascript-for-ie/feed/</wfw:commentRss>
		<slash:comments>10</slash:comments>
		</item>
		<item>
		<title>DIV height issue on IE</title>
		<link>http://www.danieltome.com/blog/2007/07/31/div-height-issue-on-ie/</link>
		<comments>http://www.danieltome.com/blog/2007/07/31/div-height-issue-on-ie/#comments</comments>
		<pubDate>Tue, 31 Jul 2007 05:06:24 +0000</pubDate>
		<dc:creator>Danno</dc:creator>
				<category><![CDATA[Annoyances]]></category>
		<category><![CDATA[Crossbrowser]]></category>
		<category><![CDATA[Internet Explorer]]></category>

		<guid isPermaLink="false">http://www.danieltome.com/blog/2007/07/31/div-height-issue-on-ie/</guid>
		<description><![CDATA[If you need to have a div tag smaller than 20px, then you will find it a bit hard to get on IE. Just add &#8220;overflow: hidden&#8221; to it&#8217;s style and you&#8217;re good to go.
I know it&#8217;s a quick google find, but there are several methods that you&#8217;ll find.
Some are telling you to add a [...]]]></description>
			<content:encoded><![CDATA[<p>If you need to have a div tag smaller than 20px, then you will find it a bit hard to get on IE. Just add &#8220;overflow: hidden&#8221; to it&#8217;s style and you&#8217;re good to go.</p>
<p>I know it&#8217;s a quick google find, but there are several methods that you&#8217;ll find.<br />
Some are telling you to add a   and set the font-size to 1px, but they all sound &#8220;<em>hackish</em>&#8221; to me.</p>
<p>I&#8217;ve been having several cross-browser related issues lately and all of them have to do with IE (well most of them on Safari, but I&#8217;m comparing IE/Firefox) I remember back in the old days when you had to work really hard to get it working on Netscape 4.016.</p>
<p>Is IE becoming the next Netscape?</p>
]]></content:encoded>
			<wfw:commentRss>http://www.danieltome.com/blog/2007/07/31/div-height-issue-on-ie/feed/</wfw:commentRss>
		<slash:comments>16</slash:comments>
		</item>
	</channel>
</rss>
