源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

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

  • 时间:2021-11-20 18:48 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:jquery 模式对话框终极版实现代码
页面滚动时随着滚动条固定在屏幕的中央,模式对话框中的内容为两种,一是iframe引入,一是HTML语句插入。在网站开发中十分常用,使用该插件十分的简单。来看一下运行效果。 [img]http://images.cnblogs.com/cnblogs_com/studyplay/green.jpg[/img] 插件使用 1、首先引入样式文件,详细代码如下所示: <link href="images/blue/css.css" rel="stylesheet" type="text/css" id="showdialogcss" /> 着里面的id一定不要忘记,他是用于切换插件皮肤的。 2、接着引入jQuery的js文件,具体代码如下: <script src="js/jquery.js"></script> 3、最后引入模式对话框插件,具体代码如下: <script src="js/dialog.js"></script> 4、编写用于点击的HTML代码,具体代码如下: <div id="diagx">单击我--模式对话框</div> 5、编写JavaScript代码,为id为“diagx”的div绑定单击模式对话框,具体代码如下所示
[url=images/blue/css.css]<script src="js/jquery.js"></script> <script src="js/dialog.js"></script> <script type="text/javascript"> $(document).ready(function(){ $('#diagx').ShowDialog({ Width:"500", Height:"300", Title:"模式对话框", skin:"blue", FrameURL:"http://www.baidu.com/", ContentFlag:"0", Contents:"<div>测试数据</div>" }); }); </script> <title>模式对话框</title> </head> <body> <div id="diagx">单击我--模式对话框</div> </body> </html>
该代码运行时,如果我们单击id为“diagx”的div层将弹出模式对话框。 插件的源代码可以在如下下载,欢迎大家下载使用,和改进,改进后不要忘记通知我一下,我也提高一下。谢谢。 打包下载地址[/url]
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部