手机版 | ------------全站资源有,统一解压码,解码平台,请点这里 ------------ 设首页 | 加收藏
当前位置: 网站首页 > jQuery库 > 文章 当前位置: jQ > 文章

jQuery模态窗口插件vintage-popup

时间:2020-06-25    点击: 次    来源:网络    作者:佚名 - 小 + 大

jQuery模态窗口插件vintage-popup
简要教程

vintage-popup是一款jQuery模态窗口插件。该模态窗口插件支持放置任何HTML标签,通过简单的配置,既可以实现一个非常炫酷的打开模态窗口特效。

使用方法

NPM

npm i -S vintage-popup                                  

yarn

yarn add vintage-popup                                

AMD方式使用

require(['vintage-popup'], function (Popup) {});                        

CommonJS方式使用

var Popup = require('vintage-popup');                       

ES6 (Webpack)

import Popup from 'vintage-popup';                     

在页面中直接引入。

                                 
HTML结构

一个模态窗口的基本HTML结构如下:

	

使用远程异步数据:

	

example.json

{  "replaces": [    {      "what": "[data-popup-id='exampleRemote'] .popup__content",      "data": "	"    }  ]}                                  
初始化插件
// initialize popup$('button').popup();// initialize with options$('button').popup({  closeOnEsc: false});                                  

在webpack中使用:

// import popup moduleimport Popup from 'vintage-popup';// fix jQuery conflict (once)Popup.expose($);// use it!$('button').popup();                          

该jQuery模态窗口插件的配置参数请参考:https://github.com/Inspired-by-Boredom/vintage-popup#options

 该jQuery模态窗口插件的github网址为:https://github.com/Inspired-by-Boredom/vintage-popup

 jQuery模态窗口插件vintage-popup 本地下载

上一篇:js多边形渐变网格背景插件

下一篇:js带视觉差的页面平滑滚动特效

推荐阅读
浙ICP备14024822号  |   QQ:79720816  |  地址:蚂蚁分享-一个只做有用的分享。  |  电话:13388629007  |  
Copyright © 2020 天人文章管理系统 版权所有,授权www.antqq.com使用 Powered by 55TR.COM