During the last months I've downloaded dozens and dozens types of jQuery plugins, used a few and found out that many of them are not cross-browser. If you've read some of my previous posts on the subject of backward compatibility with IE6 and 7, you probably know what's my standpoint. However, jQuery plugins are a completely different category. When you write a jQuery plugin, you're actually providing a new functionality to the web community using jQuery. Though it would be better if in our sites and application there was no room for IE6 and 7, sometimes our clients ask us to support these browsers or, speaking more frankly, they order us to extend our support to IE6 and 7 for whatever reason (they probably have their reasons, which obviously we don't endorse). How we can do this?
First, keep things simple. IE6 and 7 have one of the worst JavaScript engines ever appeared on the web. It's clumsy, clunky and absolutely buggy. Further, these browsers use jScript and COM objects in their implementations, not ECMAScript. Their performance is really poor. Now you get the scenario, so we should start coding accordingly. As I said earlier, you should divide your plugin code in several subcomponents and then test them separately in these browsers to check whether they work or not.
It's pointless to first write the entire plugin and then test in IE6 and 7. Instead, write a routine, test it and move to the next routine. And so on. It's better to write these subcomponents as separate functions and then incorporate them in your plugin when it's proved that they work. The next step is to test whether these components work well together, so the next phase is to build up your plugin routines by combining your subcomponents. Done that, test them again to see if they work correctly together. Then move on.
Second, beware of animations and effects. IE6 and 7 support jQuery animations in a very basic way. When you try to achieve more complex results, they may either show your effects in a sort of "slow-motion" sequence or return some JavaScript errors. You should test your animations using first very high delay values, because these are the values that can slow down considerably IE6 and 7. Then, if your plugin requires so, test the result of concatenating animations, for example to see what happens when you invoke the callback function of a jQuery effect to create a new effect.
An interesting side effect concerning IE6 and 7 is the wrong handling of image opacity. More precisely, this problem extends also to IE8. In short, if your images have a transparency, IE will show a black outline when your image becomes visible again after being hidden with a jQuery effect. When the opacity of the image is restored, the black outline disappears. To fix this, try to use alternate images without alpha transparency.
Finally, never use emulators. You should always test your plugins in a real Windows environment. Certain JavaScript behaviors of IE cannot be emulated, because they're the result of the interaction of IE with the surrounding OS environment. Always bear in mind this, or you'll probably get unexpected results.