Niall Doherty » Blog

So I finally found time to add a much-requested feature to Coda-Slider: Different classes for each tab. Now you can target individual tabs and give each one a different look. In the new demo, you’ll see that I just used different background colors to illustrate this feature, but of course you can use images if you like.

As this is just a minor addition, I’m calling the updated version “Coda-Slider 1.1.1″. Makes sense to me.

• Check out the demo
• Download Coda-Slider 1.1.1

Apologies again that I haven’t been able to respond to all your comments and emails regarding Coda-Slider. I hope you understand that it’s just something I put together for fun and experience, and it’s difficult to spend time maintaining it when I have paying jobs on offer.

Also, please keep sending me your own implementations of Coda-Slider. I will get a showcase together eventually, promise.

It’s been about six weeks since I introduced a neat little jQuery plugin called Coda-Slider. It was well received, and I was delighted to see people incorporating it into their own projects in creative ways.

However, the original Coda-Slider had some bugs and lacked some features. After numerous requests, I’ve finally found time to make some improvements, and today I’m releasing Coda-Slider 1.1. Please check out the demo, and be sure to read the rest of this post for more info and details on customization. (more…)

This is a guest post from Don Albrecht of AjaxBestiary.com. Be sure to visit his sites and check out his other works.

While most of the new features in the jQuery UI package are common across most AJAX frameworks and toolkits, the new Selectables stands out as a unique and potentially quite useful interface element. (more…)

Just noticed something quirky today regarding jQuery’s slideToggle effect in Internet Explorer versions 6 and 7. (I’m guessing the use of jQuery’s slideDown and slideUp will give you the same problem.) I’ve been creating some nice sliding div effects these past couple of weeks in work and wondering why the slide animation in IE6+ was so jagged and clunky, while Firefox and Safari rendered it perfectly. Through the process of elimination and some hair loss, I figured it out.

The fix:

Be sure that whatever it is you’re sliding (usually a div) doesn’t have any associated CSS attribute position declared. It doesn’t matter if it’s position: relative or position: absolute, or if this styling is applied to the sliding element or to a child of the sliding element; just rip it out of there.

Do that and your slideToggle should look all smooth in every browser.

UPDATE: (Oct. 29th, 2007): I’ve just released a new version of Coda-Slider. Check out the details here. The original version referred to in this post remains available for download.

These last couple of weeks in work I’ve been getting to grips with the jQuery JavaScript library to provide some cool effects on an interface I’ve been building. One effect I hoped to create was a tabbed sliding div type thing, like Panic have on their Coda site. I couldn’t find anything quite like that ready-made with jQuery, so I went about doing it myself. Using Gian Carlo Mingati’s excellent slideViewer as a starting point, I was able to achieve the desired effect. At the risk of getting sued, I’ve called it Coda-Slider.

• Check out the demo
• Download Coda-Slider

I’ve put a lot of info (features, bugs, etc.) into the demo itself, so I won’t repeat it all here. Feel free to use Coda-Slider in your own projects, and let me know how it works out. All the code is well commented or self-explanatory so you shouldn’t have much difficulty adapting it to fit your needs. if you do run into problems, let me know in the comments here.

Also, I’d really appreciate feedback on any bugs anyone notices. Suggestions for improvement are also welcome, although I likely won’t have time to implement any for a while.

UPDATE (Sept 21st, 2007): It’s been brought to my attention that there are some issues with Coda-Slider in Safari 2.04 on Mac. I’ve have no timescale for a fix; I may not get to fix it at all. Please take this into consideration if you plan to use Coda-Slider in your own projects. As of this writing, almost 2% of web users are using that version of Safari (source). Safari 3 is reportedly out of beta next month, so I’d expect usage of Safari 2.04 to decline after that.

I have a lot of pet peeves when it comes to web development. There’s unexpected pop-up windows, auto-play music, sites that tell me what browser I should use to best view its pages, resizing the browser window, screwing with my browser scroll bar, PDF links that aren’t labeled as PDF links… I could go on and on and on. Indeed, some people have taken the time to list many similar grievances (like here and here).

One that I rarely see mentioned but really bugs me is mailto links. These little feckers are supposed to open up your email client (e.g. Microsoft Outlook, Mozilla Thunderbird) and have a readily-addressed blank message waiting for you to fill out. Problem is, I don’t use an email client. I use this thing called Gmail, and I’m guessing there’s a few dozen other people with a preference for web-based email too.

I’d actually like to see a breakdown of web-based email users vs. email client users. I assume web-based email is much more popular these days, primarily because it’s so much more accessible. Your emails are stored online and you can get at them from any computer with a connection. Additionally, not having a client means one less piece of software installed on your machine, which can’t be bad

So when I need to get in contact with those faceless folk behind a website and I’m presented with a mailto link, it’s 50/50 as to whether I’ll even bother anymore. A simple contact form is a far better approach, and has the added benefit of not revealing your email address to the spambots.

Oh, and yes, I’m aware that I don’t have a contact form on this site. It’s on my to-do list, promise.

As you can probably tell, I’m currently in the middle of redesigning this site. Please excuse the scaffolding. The new build is hardly groundbreaking stuff, but it’s all I need for now. Here’s my attempt to justify the decisions made while putting the whole thing together…

Why horizontal?

The landing page of ndoherty.com scrolls horizontally instead of vertically. Why? Well, why not? I tend to think sideways, so why not have my homepage scroll the same way? I achieved the effect using The Horizontal Way template. I have noticed a few inconveniences with it, however, mostly cross-browser compatability issues. For example, I liked the fact that you could move left and right using just the mouse scroll wheel, but this doesn’t appear to work in Safari 3 and Opera 9. There also seems to be some problems displaying homepage in IE7 (surprise!), but I’m sure I can work out those kinks in due time.

Wordpress theme

I’ve had some experience with Wordpress before, but I’d never delved too much into creating my own theme. Having seen seven billion different WP themes, I knew the system was flexible, but I didn’t know how easy it was to bend. Turns out it’s pretty easy if you know some CSS. A dash of PHP knowledge helps, too.

GoDaddy hosting

Feckin’ GoDaddy. I’ve had major problems with them before trying to get a Rails project running on their servers — in the end, I moved to RailsPlayground.net — so I guess I shouldn’t have bee too surprised to find a few quirks when setting up this site. The most head-scratching was the Wordpress permalinks. I like clean URL’s, and WP allows you to have them by clicking a radio button and saving. However, doing this left me with 404’s all over the shop.

The solution? Wait a while.

Seriously, that’s it. Give it an hour or so and your permalinks will magically start working. I figure Jimmy over at GoDaddy received a telegram informing him that I wanted clean URL’s, and he had to get the okay from Mr. Garland before going downstairs to press the big red “Enable clean URL’s” button on the side of my shared hosting server. I guess you get what you pay for.

Further development

As stated, there’s plenty more work to do on this site. I’m sure to run into a few more issues and remember those I’ve already forgotten. A week from now, this will more closely resemble a finished website.