【jQuery】アニメーションポップアップウィンドウQuttons

687474703a2f2f692e696d6775722e636f6d2f49367865516b6e2e676966

Quttonsはボタンの背後にある任意のdiv要素を非表示にすることができます。
新しいコンテンツを収容するために、その大きさ、形や色を変えることができます。

JS

<script src = "Path/To/jQuery" type = "text/javascript"></script>
<script src = "Path/To/velocity.js" type = "text/javascript"></script>
<script src = "Path/To/velocity.ui.js" type = "text/javascript"></script>
<script src = "Path/To/Quttons.js" type = "text/javascript"></script>

CSS

<link rel = "stylesheet" href = "Path/To/Quttons.css" />

Dialog Box

<div class = "qutton" id = "qutton_upload">
<h2>Upload a new file</h2>
<input type="text" id = "fileUrl" placeholder = "Enter URL">
<div id="button_basic_upload"> Choose a file to upload
</div>
</div>

Qutton

var quttonUpload = Qutton.getInstance($('#qutton_upload'));
quttonUpload.init({
icon : './images/icon_upload.png',
backgroundColor : "#917466"
});
icon Quttonに表示するアイコン
backgroundColor Quttonの背景色
width Quttonの幅
height Quttonの高さ
easing アニメーションのイージング
 

【jQuery】アニメーションポップアップウィンドウQuttons

  • LATEST
  • RELATED
  • POPULAR