Extending plugin methods somehow?

[Paul Craig]

Hey,

I'm not sure that you'll respond to this, but I figured it was worth a shot.
Essentially, I'm looking to add classnames to the tooltips that mirror the classnames (or ids) of the elements to which they pertain. This is the line I'd be looking to change.

I'm not primarily a JS developer -- spent more time with PHP and Java -- so I'm a bit uncertain how to go about this (or, indeed, if I can). It looks like a new chardinJs is being created and subsequently stored as a data attribute on the body class.

Is there a way I can add a new (or modify an existing) method without forking your plugin, or should I just fork it and hope for the best? Would be quite interested in a short technical explanation, athough -- realistically -- any answer would be appreciated.

[k4roshi]

I don't know if you still need it. I faced the same problem and solved it like this.
Apparently if your target element has an id set, chardin applies a data-id attribute to the chardinjs-helper-layer.
For instance:

<a id="tutorial-view" data-intro="Hi I'm a tooltip" data-position="bottom">Explain!</a>

generates

<div data-id="tutorial-view" class="chardinjs-helper-layer chardinjs-bottom" style="width: 85px; height:39px; top:55px; left: 1156px;">
...
</div>

that you can target with

[data-id="tutorial-view"] {
  color: red;
}

[Paul Craig]

Thanks for getting back!

I actually did figure out a workaround: by overwriting a method of the chardinjs object as soon as the page loaded.

I then overwrote the _show_element() method with a copy+pasted one where one line has been changed.

After that I went totally bonkers and added a whole bunch of custom functionality that probably breaks once something changes. Got an overlay working on this site (click any of the contact links), but only after using a crowbar and a lot of duct tape.

Your way is much simpler -- wish I'd seen it earlier.

[Paul Craig]

Closing since I am no longer using chardin.js.