Advertisement
Guest User

Untitled

a guest
Oct 10th, 2015
101
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.79 KB | None | 0 0
  1. window.addEvent("domready", function(){
  2. (function($){
  3. /*
  4. | TOOLTIP FUNCTION
  5. | @version 0.1.0
  6. */
  7. var tooltips = $$("*.tooltip"),
  8. tooltipCounter = 0;
  9.  
  10. var tooltipToggle = function(element){
  11. var container = $(element).get("data-tooltip");
  12. if($(container).get("data-status") === "off"){
  13. var status = "on";
  14. } else if($(container).get("data-status") === "on"){
  15. var status = "off"
  16. }
  17.  
  18. $(container).fade("toggle").set({
  19. "data-status": status
  20. });
  21. }
  22.  
  23. var tooltip = function(element){
  24. var event = $(element).hasClass("tooltip-click");
  25. var status = $(element).hasClass("tooltip-open");
  26.  
  27. // CREATE AND INJECT TOOLTIP CONTAINER
  28. var position = $(element).getCoordinates();
  29. var container = new Element("div", {
  30. "id": "tooltip-" + tooltipCounter,
  31. "class": "tooltip-container",
  32. "data-status": "off",
  33. "text": $(element).get("data-tooltip"),
  34. styles: {
  35. "top": position.top + "px",
  36. "left": (position.left+position.width) + "px",
  37. "opacity": "0",
  38. "display": "block",
  39. "position": "absolute",
  40. "visibility": "hidden"
  41. }
  42. });
  43. if(status){
  44. $(container).set({"data-status": "on", styles: {"opacity": "1", "visibility": "visible"}});
  45. }
  46. $(element).set({"data-tooltip": $(container).get("id"), styles: {"position": "relative"}});
  47. $(container).inject(element, "after");
  48.  
  49. // ADD TOGGLE EVENTS
  50. if(event === true){
  51. $(element).addEvent("click", function(event){ tooltipToggle(event.target) });
  52. } else {
  53. $(element).addEvent("mouseover", function(event){ tooltipToggle(event.target) });
  54. $(element).addEvent("mouseout", function(event){ tooltipToggle(event.target) });
  55. }
  56. tooltipCounter++;
  57. }
  58.  
  59. Array.each(tooltips, function(element){
  60. tooltip(element);
  61. });
  62. })(document.id);
  63. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement