jQuery弹出层插件Moa Modal

所属分类:UI-弹出层

 110907  494  查看评论 (9)
分享到微信朋友圈
X
jQuery弹出层插件Moa Modal ie兼容6

特点

自定义动画和定位

自定义模态窗口样式,没有预定义的样式表!.


感谢网友Hero提供的方法

用法

1- HEADER

<link href="/component_v1.0/moaModal-master/css/style.css" rel="stylesheet" type="text/css">
<script src="/component_v1.0/moaModal-master/js/Sweefty.js" type="text/javascript"></script>
<script src="/component_v1.0/moaModal-master/js/moaModal.minified.js" type="text/javascript"></script>
<script src="/component_v1.0/moaModal-master/js/extension.js" type="text/javascript"></script>


2- HTML

<div id="workbook" class="pf_work"><a href="#" class="workbook1"><img src="/main_style/img/work_book.jpg"></a></div>
<div id="workbookQuery" class="block modal2">&nbsp;</div>


3- Javascript

<script>
	$(document).ready(function() {
		$('.workbook1').modal({
			target: '#workbookQuery',
			speed: 500,
			easing: 'easeOutBack',
			animation: 'right',
			position: '10% 50%',
			overlayClose: true,
			on: 'click'
		});

	});
</script>
相关插件-弹出层

jQuery弹出层插件

可无限次弹出,自己设置大小,手动调整大小都可(相比于layer.js要轻量)
  弹出层
 39556  318

超简单实用的弹窗jquery插件

兼容到ie8,简洁,实用,美观,可以自由更改弹窗样式。可以在弹窗中加上ajax请求的数据!
  弹出层
 99793  451

jQuery弹框、弹出层插件method.js

jq弹框 弹框标题、内容、宽高、取消确认按钮、关闭按钮、动效类型均可以参数的形式设置
  弹出层
 52592  398

移动端弹出层jquery插件简易

移动端弹出层jquery插件简易
  弹出层
 52267  334

讨论这个项目(9)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    梦在心中 0
    2018/6/1 14:50:09
    宽度和高度怎么设置? 回复
    寝室长 0
    2017/7/28 17:33:52
    怎么让modal可用鼠标拖动 回复
    liti 0
    2017/1/12 14:01:31

    CSS这个在html中包含了。

    回复
    ?.So.??ber.???? 0
    2016/7/28 10:07:47
    怎么点击关闭? 我找了一天,没有一篇帖子是这样的.你这些说明文档里给出例子不好吗?样式订了一大堆,啥用啊.我们会用么?
        西瓜0
        2016/7/28 11:07:37

        最后一个 例子Expand中不是就有关闭的方法,close : '.close'

        $('.demo8').click(function(){
            $('#demoModal2').modal('view',{
                speed : 800,
                easing : 'easeInOutElastic',
                animation : 'top height width',
                position: '10% auto',
                overlayClose : false,
                on : 'click',
                overlayColor : '#ccc',
                overlayOpacity : .9,
                close : '.close'
            });
        });
        MAN0
        2016/9/8 8:09:20
        认真点,大兄弟
    回复
    忧郁的狮子座Q旭 0
    2016/5/24 16:05:41
    它能不由按钮点击,而是表单体检事件触发吗 回复
    魔改谢馒头 0
    2015/10/14 19:10:34

    extension.js 这个也木有

    回复
    wf123537200 0
    2014/11/4 8:30:58
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复