# jBox


- [홈페이지](http://stephanwagner.me/jBox)
- [get_started](http://stephanwagner.me/jBox/get_started)
- [documentation](http://stephanwagner.me/jBox/documentation)


# 시작

## 설치

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

```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)을 사용하세요. 제품에 적용할 시에는 이 파일들을 서버에 저장하고 사용하세요.

## Tooltips

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

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


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

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

문서를 살펴본다.

[jbox draggable jsfiddle](http://jsfiddle.net/StephanWagner/wx697/)

코드를 그대로 사용해보자.
```html
<div class="DemoContainer">
	<span id="modalDragOnTitle">Toggle: Drag on title</span>    
    <br><span id="modalDragOnElement">Toggle: Drag anywhere</span>
</div>
```

```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
    });
    
});
```