JQuery模态窗口插件-LeanModal,详细使用方法及演示

模态窗口是网站开发中经常用的,点击弹出一个层用来显示或者输入,这样不仅操作方便而且用户体验也非常不错。这里我介绍一款我经常使用的jQuery插件:leanModal

20150708170447050_5164.jpg

LeanModal是一个非常不错的jQuery插件,主要用于创建模式对话框。可以展示或隐藏的页面内容,整个插件大小只有780bytes,可灵活变化高度和宽度,没有用到任何图片,支持在一个页面中创建多个实例,非常适合于创建:登录框,注册框,警告对话框等。最重要的是界面非常干净UI设计很不错。

LeanModal具有以下优点:

  • 完美隐藏的页面内容
  • 大小只有 1 kb
  •  灵活的宽度和高度
  • 免费的图像
  • 在一个页面上的多个实例
  • 伟大的登录、 注册 & 警报面板等

详细使用方法

1、 在页面上添加 JQuery,jquery.leanModal.min.js

2、 设置需页面样式表,只需包括以下覆盖样式块你现有的样式表中。务必要隐藏您模态的元素与  ‘display: none;’ 。

3、触发事件,一定要设置你的触发锚以匹配您的目标元素的 id 的 href 属性。

或如果您希望在同一页上的多个模态窗口,只需将 ‘rel’ 属性添加到您的触发器和属性,通过调用函数就像这样

演示及下载

官方网站   |   在线演示

LeanModal官方下载:下载地址

发布者:柚子,转转请注明出处:https://ityouzi.com/archives/jquery-leanmodal.html

发表评论

电子邮件地址不会被公开。 必填项已用*标注