Niall Doherty » Blog

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.

Just added a couple of projects to my portfolio.

First is my most recent freelance project, which was a site for the Mercy primary schools in Waterford. Secondly, there’s the Flash animation I created while at TSSG back in March.

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.