Sliding Notes 1.4 – Shadowchaser Release

I’m announcing a new release of my Sliding Notes plugin. It resolves a CSS conflict with Shadowbox JS , another popular WordPress plugin (hence the release name). At the same time, with this release I’m relieving the user from housekeeping the CSS parts that are vital to Sliding Notes function, but unrelated to its visual appearance.

Download it at wordpress.org.

ATTENTION Upgraders

With Sliding Notes versions prior to 1.4 you had to manually add .hidden and .block CSS clauses to your stylesheet. Please remove them again. As of Sliding Notes 1.4, these clauses are automatically added where needed.

ATTENTION Users of Shadowbox JS

If you have applied the conflict workaround, and commented out the .hidden clause in your extras.css file, you need to uncomment it again! (Look for it in the wp-content/plugins/shadowbox-js/css/ folder.)

Background

[toc class=”toc-right” style=”max-width:40%”]

In the past, there have been some reports of a curious Sliding Notes effect, where Notes were initially open on some sites. I could immediately trace the cause down to a CSS conflict with the ‘Shadowbox JS’ plugin, and advice a quick workaround, one that could be easily, alas manually, applied.

The Conflict, And The Workaround

To Sliding Notes’ function, two CSS clauses are utterly vital: .hidden and .block. Not only there presence and their contents are essential, but also their ordering. Failing to preserve CSS ordering results in some pretty weird effects, from unaesthetic, cross-browser related dynamic effects when the notes are being shown, to the notes not being initially collapsed.

Shadowbox JS’ includes some stylesheets of own, extras.css being one of them. It contains a .hidden CSS clause. This clause effectively “spoils” the aforesaid utterly sensitive CSS clause ordering, causing the unwanted effect.

Once the cause was found, a workaround became immediately obvious: Commenting out the .hidden clause in extras.css ultimately resolved the conflict.

The Problem With The Workaround

Of course, I wasn’t too happy about a state of affairs where users had to adjust their other stuff in order to use Sliding Notes.

I was even less happy with putting a burden on users to manually ensure CSS vital to the plugins function is included correctly. I figured, CSS related to visual appearance belongs in the hands of the user, but CSS related to function should be sole responsibility of the plugin.

The Solution

With these thoughts on my mind, I made a few tests if separating the functional CSS from the rest and injecting it programatically by the plugin would resolve the Shadowbox JS conflict as well.

It did! 🙂

So here it is, the brand new Shadowchaser release of Sliding Notes. It has successfully chased the “shadows of it’s past”.

Cheers and happy sliding.

3 Comments

• 
  Rob February 8, 2009 at 1:53 pm

  Thanks! It’s now working. Really appreciate your quick, helpful response.

  Rob
  
• 
  Rob February 7, 2009 at 6:21 am

  Hi,
  this looks like a great plugin. I’ve installed & activated it, inserted the shortcode on one test page.
  So far nothing happens when I click on the button.
  Is there something obvious that I’ve missed?
  Thanks for any help.
  Rob
  • 
    Hackadelic February 7, 2009 at 3:40 pm

    Rob, apparently it’s a problem with your theme. You might want to give the description and instructions in this post a try.