Sliding Notes – Scriptaculous Caveats
Last Tuesday, Jörg reported a problem where Sliding Notes didn’t work on hist site. It turned out quickly that the problem was not with Sliding Notes, but due to a javascript exception thrown when jQuery was loaded. I analyzed the effect nonetheless, and I’d like to share my insights with you, as I believe they might be of general interest.
Sliding Notes use the jQuery javascript library. There are known conflicts between jQuery and Scriptaculous, another widespread javascript library. The conflicts are particularly dramatic with older Scriptaculous versions (1.7 and less).1. Scriptaculous versions 1.8.0 and later2 still have some conflicts with jQuery, but not at a scale that they would stop each other from functioning.
Now, WordPress 2.6 and 2.7 both come with Scriptaculous 1.8.0 included, so there should not be a problem… actually.
Alas, there seems to be a series of plug-ins which come packaged with their own “version”3 of javascript libraries. This is bad, because it is likely to lead to a dynamic version chaos – a state where there’s virtually no controll over which version of which library is actually being used at which page view. (Needless to say: Sliding Notes uses the WordPress “built-in” jQuery library.)
So, if you experience strange behaviour on parts of your site, it may be worthwhile searching for duplicate or conflicting javascript libraries, and perhaps find alternatives for plug-ins that cause this.
- See for ex. this google group discussion or this post [↩]
- 1.8.2 is the current Scriptaculous version as of this writing [↩]
- Not that these are in any way specially “hacked” variants of the libraries. Just the normal, but usually meanwhile outdated versions of the library. [↩]
- Sliding Notes - Scriptaculous Caveats
- Sliding Notes HowTo - Centered Button With 1.0 Series
- Getting Started With Sliding Notes And MyCSS In 4 Super-Easy Steps
- Sliding Notes Lessons - Beware of HTML Tags In Title
- PassionDuo Theme Defect - And How To Fix It
- Sliding Notes Self Aid - Overcoming Theme Footer Defects
- Sliding Notes HowTo's - Adding An Image To The Button
- WordPress CSS Accordion Menu With Sliding Notes In 3 Easy Steps