<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	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/"
		>
<channel>
	<title>Comments on: Useful JavaScript: Expandable/Collapsable Divs</title>
	<atom:link href="http://www.nullislove.com/2008/05/30/useful-javascript-expandablecollapsable-divs/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.nullislove.com/2008/05/30/useful-javascript-expandablecollapsable-divs/</link>
	<description>Code for Coders</description>
	<lastBuildDate>Sat, 31 Dec 2011 17:28:04 +0000</lastBuildDate>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.1.2</generator>
	<item>
		<title>By: Tom</title>
		<link>http://www.nullislove.com/2008/05/30/useful-javascript-expandablecollapsable-divs/comment-page-1/#comment-1360</link>
		<dc:creator>Tom</dc:creator>
		<pubDate>Mon, 16 Feb 2009 17:23:57 +0000</pubDate>
		<guid isPermaLink="false">http://www.nullislove.com/?p=266#comment-1360</guid>
		<description>Once again, great article! I was actually looking for a clean and easy way of doing something like this with JavaScript, and this is exactly what I needed. I will implement it later, when I need to. Thanks a bunch!</description>
		<content:encoded><![CDATA[<p>Once again, great article! I was actually looking for a clean and easy way of doing something like this with JavaScript, and this is exactly what I needed. I will implement it later, when I need to. Thanks a bunch!</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Monique</title>
		<link>http://www.nullislove.com/2008/05/30/useful-javascript-expandablecollapsable-divs/comment-page-1/#comment-1347</link>
		<dc:creator>Monique</dc:creator>
		<pubDate>Thu, 08 Jan 2009 12:58:16 +0000</pubDate>
		<guid isPermaLink="false">http://www.nullislove.com/?p=266#comment-1347</guid>
		<description>Hi, found a solution to my own question :o)thought I&#039;ld post it, save other people the hassle. This code gives a + or a - button.

Put this in your CSS file:

[cc lang=&quot;css&quot;]
.buttonopenclose{
	border:1px solid #cccccc;
	display: block;
	text-align: center ;
	text-decoration: none;
	color: #FC6401;
	float: left;
	font-size: 11px;
	font-weight: bold;
	padding: 4px;
	color: #ff6600;
}
[/cc]

This is the HTML code:

[cc lang=&quot;html&quot;]
&lt;div id=&quot;openthemall&quot; class=&quot;buttonopenclose&quot;&gt;
&lt;a href=&quot;#&quot; onclick=&quot;showElement(&#039;closethemall&#039;);hideElement(&#039;openthemall&#039;);showElement(&#039;antwoord11&#039;);showElement(&#039;antwoord12&#039;);showElement(&#039;antwoord13&#039;);showElement(&#039;antwoord14&#039;);showElement(&#039;antwoord19&#039;);hideElement(&#039;vraag11&#039;);hideElement(&#039;vraag12&#039;);hideElement(&#039;vraag13&#039;);hideElement(&#039;vraag14&#039;);hideElement(&#039;vraag19&#039;);return
false;&quot;&gt;
+&lt;/a&gt;
&lt;/div&gt;

&lt;div id=&quot;closethemall&quot; style=&quot;display: none;&quot; class=&quot;buttonopenclose&quot;&gt;
&lt;a href=&quot;#&quot; onClick=&quot;window.location.reload()&quot;&gt;-&lt;/a&gt;
&lt;/div&gt;
[/cc]

</description>
		<content:encoded><![CDATA[<p>Hi, found a solution to my own question <img src='http://www.nullislove.com/wp-includes/images/smilies/icon_surprised.gif' alt=':o' class='wp-smiley' /> )thought I&#8217;ld post it, save other people the hassle. This code gives a + or a &#8211; button.</p>
<p>Put this in your CSS file:</p>
<div class="codecolorer-container css railscasts" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><table cellspacing="0" cellpadding="0"><tbody><tr><td style="padding:5px;text-align:center;color:#888888;background-color:#EEEEEE;border-right: 1px solid #9F9F9F;font: normal 12px/1.4em Monaco, Lucida Console, monospace;"><div>1<br />2<br />3<br />4<br />5<br />6<br />7<br />8<br />9<br />10<br />11<br />12<br /></div></td><td><div class="css codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap">.buttonopenclose<span style="color: #00AA00;">&#123;</span><br />
&nbsp; <span style="color: #000000; font-weight: bold;">border</span><span style="color: #00AA00;">:</span><span style="color: #933;">1px</span> <span style="color: #993333;">solid</span> <span style="color: #cc00cc;">#cccccc</span><span style="color: #00AA00;">;</span><br />
&nbsp; <span style="color: #000000; font-weight: bold;">display</span><span style="color: #00AA00;">:</span> <span style="color: #993333;">block</span><span style="color: #00AA00;">;</span><br />
&nbsp; <span style="color: #000000; font-weight: bold;">text-align</span><span style="color: #00AA00;">:</span> <span style="color: #993333;">center</span> <span style="color: #00AA00;">;</span><br />
&nbsp; <span style="color: #000000; font-weight: bold;">text-decoration</span><span style="color: #00AA00;">:</span> <span style="color: #993333;">none</span><span style="color: #00AA00;">;</span><br />
&nbsp; <span style="color: #000000; font-weight: bold;">color</span><span style="color: #00AA00;">:</span> <span style="color: #cc00cc;">#FC6401</span><span style="color: #00AA00;">;</span><br />
&nbsp; <span style="color: #000000; font-weight: bold;">float</span><span style="color: #00AA00;">:</span> <span style="color: #000000; font-weight: bold;">left</span><span style="color: #00AA00;">;</span><br />
&nbsp; <span style="color: #000000; font-weight: bold;">font-size</span><span style="color: #00AA00;">:</span> <span style="color: #933;">11px</span><span style="color: #00AA00;">;</span><br />
&nbsp; <span style="color: #000000; font-weight: bold;">font-weight</span><span style="color: #00AA00;">:</span> <span style="color: #993333;">bold</span><span style="color: #00AA00;">;</span><br />
&nbsp; <span style="color: #000000; font-weight: bold;">padding</span><span style="color: #00AA00;">:</span> <span style="color: #933;">4px</span><span style="color: #00AA00;">;</span><br />
&nbsp; <span style="color: #000000; font-weight: bold;">color</span><span style="color: #00AA00;">:</span> <span style="color: #cc00cc;">#ff6600</span><span style="color: #00AA00;">;</span><br />
<span style="color: #00AA00;">&#125;</span></div></td></tr></tbody></table></div>
<p>This is the HTML code:</p>
<div class="codecolorer-container html4strict railscasts" style="overflow:auto;white-space:nowrap;border:1px solid #9F9F9F;width:435px;"><table cellspacing="0" cellpadding="0"><tbody><tr><td style="padding:5px;text-align:center;color:#888888;background-color:#EEEEEE;border-right: 1px solid #9F9F9F;font: normal 12px/1.4em Monaco, Lucida Console, monospace;"><div>1<br />2<br />3<br />4<br />5<br />6<br />7<br />8<br />9<br /></div></td><td><div class="html4strict codecolorer" style="padding:5px;font:normal 12px/1.4em Monaco, Lucida Console, monospace;white-space:nowrap"><span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">div</span> <span style="color: #000066;">id</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;openthemall&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;buttonopenclose&quot;</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span> <span style="color: #000066;">onclick</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;showElement('closethemall');hideElement('openthemall');showElement('antwoord11');showElement('antwoord12');showElement('antwoord13');showElement('antwoord14');showElement('antwoord19');hideElement('vraag11');hideElement('vraag12');hideElement('vraag13');hideElement('vraag14');hideElement('vraag19');return</span><br />
<span style="color: #009900;">false;&quot;</span>&gt;</span><br />
+<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">div</span>&gt;</span><br />
<br />
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">div</span> <span style="color: #000066;">id</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;closethemall&quot;</span> <span style="color: #000066;">style</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;display: none;&quot;</span> <span style="color: #000066;">class</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;buttonopenclose&quot;</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #000000; font-weight: bold;">a</span> <span style="color: #000066;">href</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;#&quot;</span> <span style="color: #000066;">onClick</span><span style="color: #66cc66;">=</span><span style="color: #ff0000;">&quot;window.location.reload()&quot;</span>&gt;</span>-<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">a</span>&gt;</span><br />
<span style="color: #009900;">&lt;<span style="color: #66cc66;">/</span><span style="color: #000000; font-weight: bold;">div</span>&gt;</span></div></td></tr></tbody></table></div>
]]></content:encoded>
	</item>
	<item>
		<title>By: Monique</title>
		<link>http://www.nullislove.com/2008/05/30/useful-javascript-expandablecollapsable-divs/comment-page-1/#comment-1346</link>
		<dc:creator>Monique</dc:creator>
		<pubDate>Thu, 08 Jan 2009 09:16:42 +0000</pubDate>
		<guid isPermaLink="false">http://www.nullislove.com/?p=266#comment-1346</guid>
		<description>Hi,

I would like to be able to close all divs at the same time, any idea on how I could do this?

Thanks,
Monique</description>
		<content:encoded><![CDATA[<p>Hi,</p>
<p>I would like to be able to close all divs at the same time, any idea on how I could do this?</p>
<p>Thanks,<br />
Monique</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Monique</title>
		<link>http://www.nullislove.com/2008/05/30/useful-javascript-expandablecollapsable-divs/comment-page-1/#comment-1345</link>
		<dc:creator>Monique</dc:creator>
		<pubDate>Wed, 07 Jan 2009 14:08:39 +0000</pubDate>
		<guid isPermaLink="false">http://www.nullislove.com/?p=266#comment-1345</guid>
		<description>I got it working! It turned out I needed to add  per line.
Overlooked that.....
Thanks for the code, it helped me out!
Monique</description>
		<content:encoded><![CDATA[<p>I got it working! It turned out I needed to add  per line.<br />
Overlooked that&#8230;..<br />
Thanks for the code, it helped me out!<br />
Monique</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Monique</title>
		<link>http://www.nullislove.com/2008/05/30/useful-javascript-expandablecollapsable-divs/comment-page-1/#comment-1342</link>
		<dc:creator>Monique</dc:creator>
		<pubDate>Tue, 06 Jan 2009 00:43:14 +0000</pubDate>
		<guid isPermaLink="false">http://www.nullislove.com/?p=266#comment-1342</guid>
		<description>Hi,
Somehow I get an error (blank page) when my text is too large in the content div.
Is there any way I can avoid this?

I am using the second coding with first and second section.

Thanks a bunch,
Monique
Harmelen, the Netherlands</description>
		<content:encoded><![CDATA[<p>Hi,<br />
Somehow I get an error (blank page) when my text is too large in the content div.<br />
Is there any way I can avoid this?</p>
<p>I am using the second coding with first and second section.</p>
<p>Thanks a bunch,<br />
Monique<br />
Harmelen, the Netherlands</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Scott</title>
		<link>http://www.nullislove.com/2008/05/30/useful-javascript-expandablecollapsable-divs/comment-page-1/#comment-1259</link>
		<dc:creator>Scott</dc:creator>
		<pubDate>Mon, 25 Aug 2008 19:45:02 +0000</pubDate>
		<guid isPermaLink="false">http://www.nullislove.com/?p=266#comment-1259</guid>
		<description>Love it!! Just applied it to our site and works great. It may also be of interest to know that this is a good tool for SEO. Google has gotten much better at crawling text within java so it counts for keyword density and such. I would also like to learn how to do a scrolling java div such as the one at the bottom of this site:
http://www.volusion.com/

Thanks again!</description>
		<content:encoded><![CDATA[<p>Love it!! Just applied it to our site and works great. It may also be of interest to know that this is a good tool for SEO. Google has gotten much better at crawling text within java so it counts for keyword density and such. I would also like to learn how to do a scrolling java div such as the one at the bottom of this site:<br />
<a href="http://www.volusion.com/" rel="nofollow">http://www.volusion.com/</a></p>
<p>Thanks again!</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Ajit</title>
		<link>http://www.nullislove.com/2008/05/30/useful-javascript-expandablecollapsable-divs/comment-page-1/#comment-1254</link>
		<dc:creator>Ajit</dc:creator>
		<pubDate>Fri, 22 Aug 2008 15:54:25 +0000</pubDate>
		<guid isPermaLink="false">http://www.nullislove.com/?p=266#comment-1254</guid>
		<description>you should have considered implementing opening one div while closing previously open divs.

:)</description>
		<content:encoded><![CDATA[<p>you should have considered implementing opening one div while closing previously open divs.</p>
<p> <img src='http://www.nullislove.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> </p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Kevin Skoglund</title>
		<link>http://www.nullislove.com/2008/05/30/useful-javascript-expandablecollapsable-divs/comment-page-1/#comment-1153</link>
		<dc:creator>Kevin Skoglund</dc:creator>
		<pubDate>Fri, 30 May 2008 17:11:53 +0000</pubDate>
		<guid isPermaLink="false">http://www.nullislove.com/?p=266#comment-1153</guid>
		<description>You could and you could also use various JavaScript libraries to do the showing and hiding.

This is just a simplified version to illustrate the process.</description>
		<content:encoded><![CDATA[<p>You could and you could also use various JavaScript libraries to do the showing and hiding.</p>
<p>This is just a simplified version to illustrate the process.</p>
]]></content:encoded>
	</item>
	<item>
		<title>By: Glen</title>
		<link>http://www.nullislove.com/2008/05/30/useful-javascript-expandablecollapsable-divs/comment-page-1/#comment-1152</link>
		<dc:creator>Glen</dc:creator>
		<pubDate>Fri, 30 May 2008 17:01:19 +0000</pubDate>
		<guid isPermaLink="false">http://www.nullislove.com/?p=266#comment-1152</guid>
		<description>You should really consider using some kind of JS loader to add these events, instead of modifying the code directly.  Not only will it move things out of your HTML, it can be cached, etc, blah blah blah.

Plus, it looks pretty to not have those onclicks.</description>
		<content:encoded><![CDATA[<p>You should really consider using some kind of JS loader to add these events, instead of modifying the code directly.  Not only will it move things out of your HTML, it can be cached, etc, blah blah blah.</p>
<p>Plus, it looks pretty to not have those onclicks.</p>
]]></content:encoded>
	</item>
</channel>
</rss>

