• 百度的模态弹出窗口


    本文来源:http://www.cnblogs.com/coding1016/archive/2008/06/07/1215531.html
    先贴下效果图:


     弹出网页(相当于window.showdialog('...');

     弹出字符串(感觉这样称呼怪怪的~~)

    信息提示框(相当于window.alert('hello,PopWin');)

    是否确认框(相当于window.confirm('是否删除');)

    代码如下:

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>PopUp</title>
    <script type="text/javascript" src="js/popup.js"></script>
    <script type="text/javascript" src="js/popupclass.js"></script>
    </head>
    <body>
    <align="center">
    <input  type="button" value="打开百度" onclick="ShowIframe('百度','http://www.baidu.com',800,450)"><br>
    <input  type="button" value="HTML字符串" onclick="ShowHtmlString('字符串','<B>Hello,PopWin',400,200)"><br>
    <input  type="button" value="信息提示框" onclick="ShowAlert('提示框','<B>Hello,PopWin',200,100)"><br>
    <input  type="button" value="是否确认框" onclick="ShowConfirm('确定','是否删除','Button4','',340,80)">
    </p>
    </body>
    </html>

    调用是比较简单的,脚本是popup.js和popupclass.js。popupclass是百度网的原始JS(其实也不算完全一样,因为我觉得它那个弹出窗口的那个关闭图标不好看,就换了个~~~~)popup.js是我根据它的JS文件提取的几个调用方法。现在我介绍下popup.js,关于popupclass.js可以参见桃花小舍的百度空间的一篇文章百度空间的popup效果分析。我基本上是按照他的思路来简单的封装了。
     ShowIframe(title,contentUrl,width,height)
        说明:title 弹出窗口的标题
             contentUrl 弹出窗口的网页路径
             width 弹出窗口的宽度
             height 弹出窗口的高度
        ShowHtmlString(title,strHtml,width,height)  
        说明:title 弹出窗口的标题
             strHtml HTML代码
             width 弹出窗口的宽度
             height 弹出窗口的高度
      ShowAlert(title,alertCon,width,height)
      说明:title 弹出对话框的标题
             alertCon 弹出对话框的内容
             width 弹出对话框的宽度
             height 弹出对话框的高度
      ShowConfirm(title,confirmCon,id,str,width,height)
      说明:title弹出确认框的标题
           confirm弹出确认框的内容
           id 点击确定后要触发事件的控件ID
           str 传值 (保留)
           width 弹出确认框的宽度
           height 弹出确认矿的高度

    那么如何关闭弹出窗口呢,当然点击右上角的那个X就可以搞定了。如果用代码的话,只需要调用一个函数parent.ClosePop();就可以了。
    如果在框架弹出窗口并显示在父页面上,只需在函数前面加一个parent来修饰。如:parent.ShowIframe(‘百度','http://www.baidu.com',500,200).
    好了,先写这么多吧,有什么问题可以和我交流。
    附示例下载
    /Files/coding1016/BaiduPop.rar

  • 相关阅读:
    Codeforces 1325D
    Codeforces 1325C
    Codeforces 1311F
    Codeforces 1311E
    Codeforces 1311D
    Codeforces 1316C
    JVM调试常用命令——jstack命令与线程状态(4)
    JVM调试常用命令——jstack命令与线程状态(3)
    JVM调试常用命令——jstack命令与Java线程栈(2)
    Java中类的比较与排序方法(应用Comparable接口与Comparator接口)
  • 原文地址:https://www.cnblogs.com/weekend001/p/1642671.html
Copyright © 2020-2023  润新知