Bootstrap CustomBox 弹层
生活随笔
收集整理的這篇文章主要介紹了
Bootstrap CustomBox 弹层
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
這個模態窗口插件使用原生javascript制作,它也可以和jQuery完美的結合。
請注意:這些模態窗口動畫僅僅工作在支持各自CSS3屬性的瀏覽器上。Internet Explorer 8 和 9需要legacy.min.js的支持,但是沒有動畫效果。
?
在線實例
實例演示
使用方法
<script>$(function () {$('#element').on('click', function ( e ) {Custombox.open({target: '#modal',effect: 'fadein'});e.preventDefault();});}); </script>參數詳解
| target | string | null | Set the URL, ID or Class. |
| id | string | number | null | Set the ID for the modal. |
| cache | boolean | false | If set to false, it will force requested pages not to be cached by the browser only when send by AJAX. |
| escKey | boolean | true | Allows the user to close the modal when press escape key. |
| zIndex | string | number | auto | Overlay z-index: Auto or number. |
| overlay | boolean | true | Show the overlay. |
| overlayColor | string | #000 | Overlay color. |
| overlayOpacity | number | 0.8 | The overlay opacity level. Range: 0 to 1. |
| overlayClose | boolean | true | Allows the user to close the modal by clicking the overlay. |
| overlaySpeed | number | 300 | Sets the speed of the overlay, in milliseconds. |
| overlayEffect | string | auto | Combine any of the effects. |
| width | number | null | null | Set a fixed total width. |
| effect | string | fadein | fadein | slide | newspaper | fall | sidefall | blur | flip | sign | superscaled | slit | rotate | letmein | makeway | slip | corner | slidetogether | scale | door | push | contentscale. |
| position | string | center, center | Set position of modal. First position 'x': left, center and right. Second position 'y': top, center, bottom. |
| animation | string | null | null | Only with effects: slide or rotate (top, right, bottom, left and center) and flip (vertical or horizontal). Output position separated by commas. |
| speed | number | 600 | Sets the speed of the transitions, in milliseconds. |
?
轉載于:https://www.cnblogs.com/niuboren/p/6512917.html
與50位技術專家面對面20年技術見證,附贈技術全景圖總結
以上是生活随笔為你收集整理的Bootstrap CustomBox 弹层的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Android Json解析与总结
- 下一篇: ssh设置别名