• 홈페이지
• get_started
• documentation

jQuery, jBox.min.js, jBox.css 를 포함합니다.

snippet.javascript

< script  src = "https://code.jquery.com/jquery-2.2.3.min.js" >< / script > 
< script  src = "http://code.jboxcdn.com/0.3.2/jBox.min.js" >< / script > 
< link  href = "http://code.jboxcdn.com/0.3.2/jBox.css"  rel = "stylesheet" >

개발과 테스트 용도로만 CDN(code.jboxcdn.com)을 사용하세요. 제품에 적용할 시에는 이 파일들을 서버에 저장하고 사용하세요.

jQuery 선택자를 사용하여 툴팁을 요소에 추가할 수 있습니다.

snippet.javascript

$('.tooltip').jBox('Tooltip');

draggable div 를 찾다가 발견한 곳 (http://stephanwagner.me/jBox/documentation)

github(https://github.com/StephanWagner/jBox/releases)

문서를 살펴본다.

jbox draggable jsfiddle

코드를 그대로 사용해보자.

snippet.html

<div class="DemoContainer">
	<span id="modalDragOnTitle">Toggle: Drag on title</span>    
    <br><span id="modalDragOnElement">Toggle: Drag anywhere</span>
</div>

snippet.javascript

$(document).ready(function() {
 
    // Drag with title
    new jBox('Modal', {
        attach: $('#modalDragOnTitle'),
        width: 180,
        height: 50,
        title: 'jBox',
        overlay: false,
        content: 'Drag me around by using the title',
        draggable: 'title'
    });
 
    // Drag anywhere
    new jBox('Modal', {
        attach: $('#modalDragOnElement'),
        width: 180,
        height: 50,
        title: 'jBox',
        overlay: false,
        createOnInit: true,
        content: 'Drag me around by clicking anywhere',
        draggable: true
    });
 
});