iziModal实现带分组可最大化提示框弹出层通知栏效果代码

代码语言:html

所属分类:弹出层

代码描述:iziModal实现带分组可最大化提示框弹出层通知栏效果代码,可以显示自定义内容、支持文字、iframe网页、html、支持自动倒计时关闭、不同位置弹出、按钮设置等。

代码标签: iziModal 分组 最大化 提示框 弹出层 通知栏

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html lang="en">

<head>

   
<meta charset="UTF-8">


   
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/reset.min.css">
   
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/iziModal.min.css">

   
<style>
       
.button {
         
display: inline-block;
         
margin: 20px;
         
padding: 10px 20px;
         
background:#fff;
         
border:1px #333 solid;
         
font-size:14px;
         
color:#333;
       
}
        a
{
         
font-size:14px;
         
color:#333;
         
text-decoration:none;
       
}
       
.close {
         
text-align:right;
         
padding: 10px;
       
}
        p
{
         
padding: 20px;
         
line-height:1.6;
       
}
        video
{
         
width:100%;
         
height:auto;
       
}
   
</style>




</head>

<body>
   
<p>弹出层提示框</p>
   
<button class="open-default button">default</button>
   
<div id="modal-default">
       
<div class="close">
           
<a data-izimodal-close="">×</a>
       
</div>
       
<p>这是默认的,只有一个关闭按钮</p>
   
</div>

   
<button class="open-options button">options</button>
    <div id="modal-options" data-izimodal-group="group1" data-izimodal-loop.........完整代码请登录后点击上方下载按钮下载查看

网友评论0