<?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>BarelyBlogging &#187; tabber</title>
	<atom:link href="http://www.barelyfitz.com/blog/archives/category/tabber/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.barelyfitz.com/blog</link>
	<description>Patrick Fitzgerald of BarelyFitz Designs</description>
	<lastBuildDate>Thu, 13 Oct 2011 01:55:46 +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>movable tabber</title>
		<link>http://www.barelyfitz.com/blog/archives/2007/08/15/642/</link>
		<comments>http://www.barelyfitz.com/blog/archives/2007/08/15/642/#comments</comments>
		<pubDate>Wed, 15 Aug 2007 15:16:22 +0000</pubDate>
		<dc:creator>pat</dc:creator>
				<category><![CDATA[General]]></category>
		<category><![CDATA[tabber]]></category>
		<category><![CDATA[tabbifier]]></category>

		<guid isPermaLink="false">http://www.barelyfitz.com/blog/archives/2007/08/15/642/</guid>
		<description><![CDATA[Cool, the folks over at Movable Type (blogging software) are using my JavaScript tabs script. They even came up with a nice enhancement.
]]></description>
			<content:encoded><![CDATA[<p>Cool, the folks over at <a href="http://www.movabletype.com/products/mt4.html">Movable Type</a> (blogging software) are using my <a href="http://www.barelyfitz.com/projects/tabber/">JavaScript tabs</a> script. They even came up with a nice <a href="http://groups.google.com/group/barelyfitz/browse_thread/thread/03e8b0672238391a">enhancement</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.barelyfitz.com/blog/archives/2007/08/15/642/feed/</wfw:commentRss>
		<slash:comments>13</slash:comments>
		</item>
		<item>
		<title>resolio and other stuff</title>
		<link>http://www.barelyfitz.com/blog/archives/2007/05/10/578/</link>
		<comments>http://www.barelyfitz.com/blog/archives/2007/05/10/578/#comments</comments>
		<pubDate>Fri, 11 May 2007 02:25:07 +0000</pubDate>
		<dc:creator>pat</dc:creator>
				<category><![CDATA[Apple]]></category>
		<category><![CDATA[tabber]]></category>

		<guid isPermaLink="false">http://www.barelyfitz.com/blog/archives/2007/05/10/578/</guid>
		<description><![CDATA[I ran across this site for creating attractive online resumes: Resolio. I started using it and noticed that they&#8217;re using my tabber script in their interface. I&#8217;m also using tabber in a major project at work &#8211; it&#8217;s a great way to get a quick interface going without any effort.
I finally got around to installing [...]]]></description>
			<content:encoded><![CDATA[<p>I ran across this <a href="http://resolio.com/">site for creating attractive online resumes: Resolio</a>. I started using it and noticed that they&#8217;re using <a href="http://www.barelyfitz.com/projects/tabber/">my tabber script</a> in their interface. I&#8217;m also using tabber in a major project at work &#8211; it&#8217;s a great way to get a quick interface going without any effort.</p>
<p>I finally got around to installing Ubuntu Linux on Kirsten&#8217;s old PC. The old PC had struggled to run Windows XP, but it seems pretty zippy with Linux. I have it set up on my desk: two monitors for my Windows PC, and a third for the Linux box. Now I&#8217;m trying to get Synergy working so I can use a single mouse/keyboard to span all three monitors. It will be good to get back into a real OS after slumming in Windows for so long.</p>
<p>Speaking of a real OS, I moved Kirsten to a nice iMac last year, with mixed results. The mouse that they ship with these things is absolutely horrible. She had a heck of a time trying to burn some music to a CD (iTunes is pretty unintuitive in that regard: you can&#8217;t just select some songs and burn a CD, you have to select the songs, create a playlist, then burn the playlist to a CD). Also, <a href="http://kids.barelyfitz.com/">the kids</a> use her computer, and there are just certain things and websites that won&#8217;t run on a Mac, so she occassionaly comes down to the basement to use my Windows PC.</p>
<p>In any case, I&#8217;m hoping to get a MacBook when they make their next revision, which will hopefully contain the new Santa Rosa chipset and LED backlit monitor.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.barelyfitz.com/blog/archives/2007/05/10/578/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>workaround for entity bug (?) in tabber</title>
		<link>http://www.barelyfitz.com/blog/archives/2007/02/06/527/</link>
		<comments>http://www.barelyfitz.com/blog/archives/2007/02/06/527/#comments</comments>
		<pubDate>Tue, 06 Feb 2007 13:25:49 +0000</pubDate>
		<dc:creator>pat</dc:creator>
				<category><![CDATA[DHTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[UI]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[programming]]></category>
		<category><![CDATA[tabber]]></category>
		<category><![CDATA[tabbifier]]></category>
		<category><![CDATA[user interface]]></category>
		<category><![CDATA[web design]]></category>
		<category><![CDATA[webdesign]]></category>

		<guid isPermaLink="false">http://www.barelyfitz.com/blog/archives/2007/02/06/527/</guid>
		<description><![CDATA[A user of my tabber script discovered that when his tab headings had an ampersand character like this:
&#60;h2&#62;Me &#38;amp; My Shadow&#60;/h2&#62;
Then the tab control displayed &#8220;&#38;amp;&#8221; instead of a single ampersand character.
It looks like this occurs because the JavaScript DOM function document.createTextNode() does not convert entities. However, it looks like innerHTML does convert entities, so [...]]]></description>
			<content:encoded><![CDATA[<p>A user of my <a href="http://www.barelyfitz.com/projects/tabber/">tabber</a> script discovered that when his tab headings had an ampersand character like this:</p>
<p><code>&lt;h2&gt;Me &amp;amp; My Shadow&lt;/h2&gt;</code></p>
<p>Then the tab control displayed &#8220;&amp;amp;&#8221; instead of a single ampersand character.</p>
<p>It looks like this occurs because the JavaScript DOM function document.createTextNode() does not convert entities. However, it looks like innerHTML does convert entities, so to fix your problem find the following line in <a href="http://www.barelyfitz.com/projects/tabber/tabber.js">tabber.js</a>:</p>
<p><code>DOM_a.appendChild(document.createTextNode(t.headingText));</code></p>
<p>and replace with the following:</p>
<p><code>DOM_a.innerHTML = t.headingText;</code></p>
<p>I&#8217;ll think about this some more and if I can&#8217;t find any bad side effects I&#8217;ll add to the tabber code.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.barelyfitz.com/blog/archives/2007/02/06/527/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
		<item>
		<title>JavaScript tabbifier v1.7 new features</title>
		<link>http://www.barelyfitz.com/blog/archives/2006/04/10/314/</link>
		<comments>http://www.barelyfitz.com/blog/archives/2006/04/10/314/#comments</comments>
		<pubDate>Mon, 10 Apr 2006 05:27:49 +0000</pubDate>
		<dc:creator>pat</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[DHTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[UI]]></category>
		<category><![CDATA[tabber]]></category>

		<guid isPermaLink="false">http://www.barelyfitz.com/blog/archives/2006/04/10/314/</guid>
		<description><![CDATA[
I just released a new version of my JavaScript tab interface software.
New Features

Can automatically set a unique id for each tab navigation link, which allows you to individually style each tab.
Includes a &#8220;minimized&#8221; version of the code (with comments and whitespace removed, for extra-fast loading).

]]></description>
			<content:encoded><![CDATA[<div style="margin: 0pt 1em 1em 0pt; float: right"><img id="image282" alt="Tabber" src="http://www.barelyfitz.com/blog/upload/tabber.png" /></div>
<p>I just released a new version of my <a href="http://www.barelyfitz.com/projects/tabber/">JavaScript tab interface</a> software.</p>
<h3>New Features</h3>
<ul>
<li>Can automatically set a unique id for each tab navigation link, which allows you to individually style each tab.</li>
<li>Includes a &#8220;minimized&#8221; version of the code (with comments and whitespace removed, for extra-fast loading).</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.barelyfitz.com/blog/archives/2006/04/10/314/feed/</wfw:commentRss>
		<slash:comments>48</slash:comments>
		</item>
		<item>
		<title>JavaScript tab interface with persistent tabs</title>
		<link>http://www.barelyfitz.com/blog/archives/2006/04/07/309/</link>
		<comments>http://www.barelyfitz.com/blog/archives/2006/04/07/309/#comments</comments>
		<pubDate>Fri, 07 Apr 2006 05:38:45 +0000</pubDate>
		<dc:creator>pat</dc:creator>
				<category><![CDATA[DHTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[UI]]></category>
		<category><![CDATA[cookies]]></category>
		<category><![CDATA[tabber]]></category>
		<category><![CDATA[tabbifier]]></category>
		<category><![CDATA[user interface]]></category>

		<guid isPermaLink="false">http://www.barelyfitz.com/blog/archives/2006/04/07/309/</guid>
		<description><![CDATA[
Now with yummy cookies!
I added an example page showing how you can use the new onLoad and onClick function hooks in my JavaScript tabifier to make the tabs persistent (using browser cookies).
That is, if you leave the page and come back later, the tab you previously selected will still be selected.
]]></description>
			<content:encoded><![CDATA[<div class="shadow"><img id="image308" alt="cookies" src="http://www.barelyfitz.com/blog/upload/cookies.jpg" /></div>
<p>Now with yummy cookies!</p>
<p>I added an example page showing how you can use the new onLoad and onClick function hooks in my <a href="http://www.barelyfitz.com/projects/tabber/">JavaScript tabifier</a> to make the tabs persistent (using browser cookies).</p>
<p>That is, if you leave the page and come back later, the tab you previously selected will still be selected.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.barelyfitz.com/blog/archives/2006/04/07/309/feed/</wfw:commentRss>
		<slash:comments>12</slash:comments>
		</item>
		<item>
		<title>JavaScript tabbifier v1.6 new features</title>
		<link>http://www.barelyfitz.com/blog/archives/2006/04/03/299/</link>
		<comments>http://www.barelyfitz.com/blog/archives/2006/04/03/299/#comments</comments>
		<pubDate>Tue, 04 Apr 2006 04:06:10 +0000</pubDate>
		<dc:creator>pat</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[DHTML]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[UI]]></category>
		<category><![CDATA[tabber]]></category>

		<guid isPermaLink="false">http://www.barelyfitz.com/blog/archives/2006/04/03/299/</guid>
		<description><![CDATA[
I just released a new version of my JavaScript tab interface software.
New Features

You can set a custom onLoad function to be called after the tab interface has finished initializing.
You can set a custom onClick function to be called when the user clicks a tab. In addition to performing any other actions, this function can stop [...]]]></description>
			<content:encoded><![CDATA[<div style="margin: 0pt 1em 1em 0pt; float: right"><img alt="Tabber" id="image282" src="http://www.barelyfitz.com/blog/upload/tabber.png" /></div>
<p>I just released a new version of my <a href="http://www.barelyfitz.com/projects/tabber/">JavaScript tab interface</a> software.</p>
<h3>New Features</h3>
<ul>
<li>You can set a custom onLoad function to be called after the tab interface has finished initializing.</li>
<li>You can set a custom onClick function to be called when the user clicks a tab. In addition to performing any other actions, this function can stop the tab from changing.</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.barelyfitz.com/blog/archives/2006/04/03/299/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
		<item>
		<title>Learn CSS positioning in ten steps</title>
		<link>http://www.barelyfitz.com/blog/archives/2006/03/28/284/</link>
		<comments>http://www.barelyfitz.com/blog/archives/2006/03/28/284/#comments</comments>
		<pubDate>Tue, 28 Mar 2006 16:07:02 +0000</pubDate>
		<dc:creator>pat</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[DHTML]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[tabber]]></category>

		<guid isPermaLink="false">http://www.barelyfitz.com/blog/archives/2006/03/28/284/</guid>
		<description><![CDATA[
Here&#8217;s an interactive tutorial I&#8217;m working on:
Learn CSS Positioning in ten steps
I&#8217;m using it to give some CSS and HTML training today. It uses a customized version of my JavaScript tabs interface and triggers a styleswitcher each time you switch tabs, so you can see the CSS change right on the page.
It&#8217;s a work in [...]]]></description>
			<content:encoded><![CDATA[<div class="shadow"><img id="image285" alt="CSS positioning" src="http://www.barelyfitz.com/blog/upload/css-positioning.png" /></div>
<p>Here&#8217;s an interactive tutorial I&#8217;m working on:</p>
<p><a href="http://barelyfitz.com/screencast/html-training/css/positioning/">Learn CSS Positioning in ten steps</a></p>
<p>I&#8217;m using it to give some CSS and HTML training today. It uses a customized version of my <a href="http://www.barelyfitz.com/projects/tabber/">JavaScript tabs</a> interface and triggers a styleswitcher each time you switch tabs, so you can see the CSS change right on the page.</p>
<p>It&#8217;s a work in progress, so let me know if you have any suggestions.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.barelyfitz.com/blog/archives/2006/03/28/284/feed/</wfw:commentRss>
		<slash:comments>141</slash:comments>
		</item>
		<item>
		<title>JavaScript tabbifier v1.5 new features</title>
		<link>http://www.barelyfitz.com/blog/archives/2006/03/26/281/</link>
		<comments>http://www.barelyfitz.com/blog/archives/2006/03/26/281/#comments</comments>
		<pubDate>Mon, 27 Mar 2006 04:16:02 +0000</pubDate>
		<dc:creator>pat</dc:creator>
				<category><![CDATA[DHTML]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[UI]]></category>
		<category><![CDATA[tabber]]></category>
		<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://www.barelyfitz.com/blog/archives/2006/03/26/281/</guid>
		<description><![CDATA[
I just released a new version of my JavaScript tab interface software. It has some new features that make it crazy-easy to use,  plus I eliminated a memory leak in the IE browser (damn you Microsoft!).
New Features

You can set the tabberOptions global variable before you include tabber.js to change any of the tabber settings.
You [...]]]></description>
			<content:encoded><![CDATA[<div style="margin: 0pt 1em 1em 0pt; float: right"><img id="image282" alt="Tabber" src="http://www.barelyfitz.com/blog/upload/tabber.png" /></div>
<p>I just released a new version of my <a href="http://www.barelyfitz.com/projects/tabber/">JavaScript tab interface</a> software. It has some new features that make it crazy-easy to use,  plus I eliminated a memory leak in the IE browser (damn you Microsoft!).</p>
<h3>New Features</h3>
<ul>
<li>You can set the tabberOptions global variable before you include tabber.js to change any of the tabber settings.</li>
<li>You no longer have to specify a title for each tab &#8211; it automatically finds heading elements in the body of the tab. Of course you can still specify a title if you don&#8217;t have headings or to override the title of the tab. And if you don&#8217;t do either it automatically numbers the tabs. See also tabberOptions.titleElements and tabberOptions.titleElementsStripHTML.</li>
<li>Removes the title attribute from the tab so it does not appear as a tooltip when you mouseover the body of the tab. See also tabberOptions.removeTitle.</li>
<li>You can prevent tabber from running automatically in the onload event. See tabberOptions.manualStartup.</li>
<li>Fixed a small memory leak that appeared in the IE web browser.</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://www.barelyfitz.com/blog/archives/2006/03/26/281/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Nesting instict</title>
		<link>http://www.barelyfitz.com/blog/archives/2006/03/20/268/</link>
		<comments>http://www.barelyfitz.com/blog/archives/2006/03/20/268/#comments</comments>
		<pubDate>Mon, 20 Mar 2006 05:53:25 +0000</pubDate>
		<dc:creator>pat</dc:creator>
				<category><![CDATA[GUI]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[UI]]></category>
		<category><![CDATA[tabber]]></category>

		<guid isPermaLink="false">http://www.barelyfitz.com/blog/archives/2006/03/20/268/</guid>
		<description><![CDATA[
I&#8217;m running some tests tonight on my JavaScript tabber code&#8230; yeah, I would say it handles nested tabs.
]]></description>
			<content:encoded><![CDATA[<p><img id="image267" alt="Nested tab interface" src="http://www.barelyfitz.com/blog/upload/tabber-nested.png" /></p>
<p>I&#8217;m running some tests tonight on my <a href="http://www.barelyfitz.com/projects/tabber/">JavaScript tabber</a> code&#8230; yeah, I would say it handles nested tabs.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.barelyfitz.com/blog/archives/2006/03/20/268/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Oh what tangled webs we weave&#8230;</title>
		<link>http://www.barelyfitz.com/blog/archives/2006/03/15/253/</link>
		<comments>http://www.barelyfitz.com/blog/archives/2006/03/15/253/#comments</comments>
		<pubDate>Thu, 16 Mar 2006 03:31:10 +0000</pubDate>
		<dc:creator>pat</dc:creator>
				<category><![CDATA[DHTML]]></category>
		<category><![CDATA[FSM]]></category>
		<category><![CDATA[Flying Spaghetti Monster]]></category>
		<category><![CDATA[General]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[OOP]]></category>
		<category><![CDATA[tabber]]></category>

		<guid isPermaLink="false">http://www.barelyfitz.com/blog/archives/2006/03/15/253/</guid>
		<description><![CDATA[Because I didn&#8217;t want to foul up the namespace in my JavaScript tabber, I attached the tabber object directly to the DOM element it was controlling, then I had to add several &#8220;pointers&#8221; back and forth between the object and various DOM elements so they could get to each other without relying on any variables. [...]]]></description>
			<content:encoded><![CDATA[<p>Because I didn&#8217;t want to foul up the namespace in my <a href="http://www.barelyfitz.com/projects/tabber/">JavaScript tabber</a>, I attached the tabber object directly to the DOM element it was controlling, then I had to add several &#8220;pointers&#8221; back and forth between the object and various DOM elements so they could get to each other without relying on any variables. When you look at it like this, it seems rather complicated:</p>
<p><img alt="Tabber diagram" id="image252" src="http://www.barelyfitz.com/blog/upload/tabber-diagram.png" /></p>
<p>I wonder if there are any issues with &#8220;memory leaks&#8221; due to IE&#8217;s faulty garbage collection&#8230; let me know if you notice anything.</p>
<p><strong>Update</strong>: Hold the presses, I found a few more links. Some of these pointers are not used except when creating new elements to add into the DOM, so I can probably just switch those to use local variables. It shouldn&#8217;t matter, but with IE&#8217;s faulty garbage collection, who knows if it might cause problems.</p>
<p><img alt="Tabber diagram 2" id="image254" src="http://www.barelyfitz.com/blog/upload/tabber-diagram2.png" /></p>
<p><strong>Update</strong> <img src='http://www.barelyfitz.com/blog/wp-includes/images/smilies/icon_surprised.gif' alt=':o' class='wp-smiley' /> h good god, the squiggly lines have taken over!</p>
<p><img id="image255" alt="tabber-diagram3.png" src="http://www.barelyfitz.com/blog/upload/tabber-diagram3.png" /></p>
]]></content:encoded>
			<wfw:commentRss>http://www.barelyfitz.com/blog/archives/2006/03/15/253/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
	</channel>
</rss>

