The latest version (1.1.17) has introduced a new feature that I want to highlight a bit in here. It’s currently available for the following three commands: Tabs, accordion and ticker.

So what is it? Basically it’s a way to write more agnostic markup. For example the tab command till now has needed the following HTML structure to work correctly:

div (container)
    div (element)
        h3 (title)
        div (content)

Now maybe your CMS module has another idea of how to display the information you want to put into a tab, maybe you have the following structure:

ul (container)
    li (element)
        h2 (title)
        p (content)

What can you do? Well, just use the latest version of jKit of course. jKit does now detect the kind of elements you are using based on the structure of your HTML. It still has to be more or less valid HTML, but you don’t need to use H3 for the title of the individual tabs or a div for the individual elements. You can now do it your own way.

Now jKit of course hasn’t got an AI or something, even if I could write such a thing, I’m sure it wouldn’t be fast at parsing tons of DOM nodes, so there are still a few rules to follow. You can actually add some additional elements on the same level as the elements you want to detect, but they have to be either in the minority or they have to follow after the elements you want to detect. The detection is fluid or fuzzy in that it isn’t 100% strict, but if you want to be 100% sure that something will get detected, try to be as strict in your structure as possible. And as already mentioned, some structures are not parsed correctly by some or all browsers. For example with the above “ul > li > p” structure, if you put div elements into that “p”, than the browser will first move them out of the p before jKit even has a chance to parse the data, as “p” isn’t a grouping element. Or in non HTML 5 browsers, like IE7 and IE8, you can’t use HTML 5 elements like “section” to build your structure, it’s just not being detected correctly by the browser.

Hope you like this feature as much as I do, and if you find a bug in the pattern detection, please let me know. 🙂