Heim >Web-Frontend >js-Tutorial >jquery 模式对话框终极版实现代码_jquery

jquery 模式对话框终极版实现代码_jquery

WBOY
WBOYOriginal
2016-05-16 18:45:391059Durchsuche

页面滚动时随着滚动条固定在屏幕的中央,模式对话框中的内容为两种,一是iframe引入,一是HTML语句插入。在网站开发中十分常用,使用该插件十分的简单。来看一下运行效果。

插件使用
1、首先引入样式文件,详细代码如下所示:

着里面的id一定不要忘记,他是用于切换插件皮肤的。
2、接着引入jQuery的js文件,具体代码如下:

3、最后引入模式对话框插件,具体代码如下:

4、编写用于点击的HTML代码,具体代码如下:

单击我--模式对话框

5、编写JavaScript代码,为id为“diagx”的div绑定单击模式对话框,具体代码如下所示
复制代码 代码如下:

" //模式对话框中显示的HTML内容
});
});


该插件的默认参数还有Intopacity表示模式对话背景(就是整个页面遮罩层)的透明度默认值为“0.2”。整个例子的全部HTML代码如下所示:
复制代码 代码如下:








"
});
});

模式对话框


单击我--模式对话框




该代码运行时,如果我们单击id为“diagx”的div层将弹出模式对话框。
插件的源代码可以在如下下载,欢迎大家下载使用,和改进,改进后不要忘记通知我一下,我也提高一下。谢谢。
打包下载地址
Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn