jquery popupwindow实现多窗口弹出层效果代码
代码语言:html
所属分类:弹出层
代码描述:jquery popupwindow实现多窗口弹出层效果代码
代码标签: jquery popupwindow 多窗口 弹出层
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/popupwindow.css"> <style> .htmleaf-content { width: 300px; height: 200px; margin: 50px auto; } </style> </head> <body> <button id="basic-demo_button" class="btn btn-primary">单窗口示例</button> <div id="basic-demo" class="example_content">这是一个单窗口示例!</div> <button id="demo-2_button1" class="btn btn-danger">多窗口示例</button> <div id="demo-2_first" class="example_content"> <p>这是一个 <b>模态</b> 窗口。</p> <p>通过下面的按钮,你可以打开更多的窗口!</p> <button id="demo-2_button2" class="btn btn-primary">窗口2</button> <button id="demo-2_button3" class="btn btn-primary">窗口3</button> </div> <div id="demo-2_second" class="example_content">这是第二个弹出窗口!</div> <div id="demo-2_third" class="example_content">这是第三个弹出窗口!</div> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.1.11.min.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/popupwindow.min.js"></script> <script> var Demo = (function ($, undefined) { $(function () { QuickDemo(); example2(); }); function QuickDemo() { $("#basic-demo").PopupWindow({ autoOpen: false }); $("#basic-demo_but.........完整代码请登录后点击上方下载按钮下载查看
网友评论0