j Box 介绍
j Box 是 一个 强大和灵活的 jQuery 插件 ，可用于所有的模态框、 提示 、 通知 以及更多场景.?
Tooltips
Create a new instance of j Box Tooltip and attach it to elements:
new j Box ('Tooltip',{
attach: '.tooltip'
});
Now elements with will open tooltips:
<span class="tooltip" title="My f irs t tooltip">Hover me!</span>
<span class="tooltip" title="My second tooltip">Hover me!</span>
Modal windows
You can set up modal windows the same way as tooltips. But most of times you'd want more variety,like a title or html content:new j Box ('Modal',{width: 300,height: 200,attach: '#myModal',title: 'My Modal Window',content: '<i>Hello there!</i>'});<div id="myModal">Click me to open a modal window!</div>Confirm windows
Confirm windows are modal windows which requires the user to confirm a click action on an element. Give an element the attribute data-confirm to attach it:
new j Box ('Confirm',{
confirmButton: 'Do it!',
cancelButton: ' nop e'
});
<div onclick="alert('Yay! You did it!')" data-confirm="Do you really want to do this?">Click me!</div>
<a href="https://stephanwagner.me/j Box " data-confirm="Do you really want to leave this page?">Click me!</a>
Notices
A notice will open automatically and destroy itself after some time:
new j Box ('Notice',{
content: 'Hurray! A notice!'
});
Images
To create image windows you only need following few li nes :
new j Box ('Image');
<a href="/image-large.jpg" data-j Box -image=" gal lery1" title="My image"><img src="/image.jpg" alt=""></a>
网站地址 : https://stephanwagner.me/jBox
GitHub: https://github.com/StephanWagner/jBox
网站描述: 模态框、 提示 、 通知 的 jQuery 插件
jBox官方网站
官方网站： https://stephanwagner.me/jBox
如果觉得 网站内容还不错，欢迎将 网站 推荐给程序员好友。