Jquery Special Events? What are they? How do I use them? Would this example be a good candidate for using Jquery Special Events?

Question

What are Jquery Special Events? I googled it and am still a little confused, I think I might understand a little bit about it though. Please tell me if this would be a good candidate to code using Jquery Special Events.

I need to create a feature where people can bookmark a paragraph on an article page, so that they may come back later and continue reading where they left off. There will be a link that says "Place A Bookmark", when the person clicks that link, it will enable "Bookmarking Mode" where a person may now hover over a paragraph within the article, and when they're hovered over a paragraph, a div appears over that paragraph with the words "BOOKMARK THIS", when they hover off of that paragraph, that div disappears. When they click on a paragraph when in "bookmarking mode", the text within the "BOOKMARK THIS" div changes to "YOU PLACED A BOOKMARK", then the div disappears after a few seconds and "Bookmarking Mode" disables. If the user already placed a bookmark on the page, but decides to move the bookmark to another paragraph, then everything is the same as if the person is placing the bookmark for the first time, but the text will instead read "YOUR BOOKMARK HAS BEEN MOVED".

If I understand correctly, and this example is indeed a good candidate for Special Events, can someone help me with the basic layout of the structure? I don't need all the coding, I just need to know where the hover code should go, and the hover out, and the click, and moving a bookmark, etc.

jQuery.event.special.myevent = {
  setup: function( data, namespaces, eventHandle ) {
    // code
  },
  teardown: function( namespaces ) {
    // code
  },
  add: function( handleObj ) {
    // code
  },
  remove: function( handleObj ) {
    // code
  },
  _default: function( event ) {
    // code
  }
};

From benalman.com/special-events

Answer 1

Looks like you can add extra functionality to your custom bind/trigger events.

Here's a great article

jQuery.event.special.myevent = {
  setup: function( data, namespaces, eventHandle ) {
    alert("start");
  },
  teardown: function( namespaces ) {
    alert("done");
  },
  add: function( handleObj ) {
    alert("new")
  },
  remove: function( handleObj ) {
    alert("delete")
  },
  _default: function( event ) {
    alert("default");
  }
};

$(obj).bind("myEvent", f); // start, new

$(obj).bind("myEvent", g); // new

$(obj).trigger("myEvent"); // default

$(obj).unbind("myEvent", f); // delete

$(obj).unbind("myEvent", g); // delete, done

Answer 2

It sounds to me as though you would do the hovering etc via normal jQuery hover events. If you wanted to use the custom events then you could create ones for when Bookmark Mode is enabled and then do your normal hover, click events within that.

http://net.tutsplus.com/tutorials/javascript-ajax/custom-events-and-special-events-api-in-jquery/ Also might be helpful as they have examples of how to set up an actual special event.