fortesinformatica / Sideshow

Sideshow is a powerful javascript library which aims to reduce your user's learning curve by providing a way to create step-by-step interactive tours. Explain the features of your application, control your end-user's interaction with your UI, emphasize what you're explaining in each step by masking it. Just think! The sky is the limit!
http://fortesinformatica.github.io/Sideshow
Apache License 2.0
86 stars 31 forks source link

Allow providing of DOM / jQuery object for subject / targets #12

Closed DanielApt closed 9 years ago

DanielApt commented 9 years ago

Instead of using a selector string, it's nice to use jQuery / DOM reference.

So in a step it would be:

{
    subject: $('.container').not('.foo')
}
alcidesqueiroz commented 9 years ago

Assigning a jQuery wrapped object already works for specifying a subject, exactly the way you suggested. It's another option for subject definition, but not really a replacement for the string selector. The reason we've chosen to use a jQuery string selector (allowing the use of jQuery extended selectors too) is that this way the subject is queried on demand, at the beginning of each step. Sometimes, you simply can't select an element in advance, just because it's not rendered yet. The code sample you've posted already works, but with one condition: at the moment of tutorial's definition, the jQuery expresion $('.container').not('.foo') must return at least (and only) one element reference. As this feature already exists, I'm closing this issue. Ok? =)