Firejune

Prototip은 Prototype/Scriptaculous를 기반하여 만들어진 툴팁 컴포넌트이다. 표준을 따르는 HTML, CSS를 이용한 다양한 레이아웃 디자인과 출력효과를 내장하고 있어 단순히 메시지를 표시하는 것 이상의 표현이 가능하다. 특히, CSS를 이용해 디자인을 손쉽게 커스터마이즈 할 수 있게 한 점과 특정 타겟의 시야를 가리지 않도록 하는 Hooking옵션은 사용자의 입장을 충분히 고려해 만든 모습이 역력하다.

new Tip(
  element,                 // the id of your element
  content,                 // html
  {  
    className: 'tooltip',  // or your own class
    closeButton: false    // or true
    duration: 0.3,         // duration of the effect, if used
    delay: 0.2             // seconds before tooltip appears
    effect: false,        // false, 'appear' or 'blind'
    fixed: false,         // follow the mouse if false
    hideOn: 'mouseout'     // 'click', 'mousemove', 'mouseover',
                           // { element: 'element|target|tip|closeButton|.close',
                           //   event: 'click|mouseover|mousemove' }
    hook: false,          // { element: 'topLeft|topRight|bottomLeft|bottomRight|
                           //  topMiddle|bottomMiddle|leftMiddle|rightMiddle',
                           //  tip: 'topLeft|topRight|bottomLeft|bottomRight|
                           //  topMiddle|bottomMiddle|leftMiddle|rightMiddle' }
    offset: {x:16, y:16}   // or your own, example: {x:30, y:200}
    showOn: 'mousemove',   // or 'click', 'mouseover', 'mouseout'                              
    target: 'anotherId',   // make the tooltip appear on another element
    title: false,         // or a string, example: 'tip title'
    viewport: true        // keep within viewport, false when fixed or hooked
  }
);