精华内容
下载资源
问答
  • 经常上网的朋友可能会到过这样一些...其实制作这样的页面效果非常的容易,只要往该页面的HTML里加入几段Javascript代码即可实现。下面俺就带您剖析它的奥秘。 【1、最基本的弹出窗口代码】 其实代码非常简单: &l...

    经常上网的朋友可能会到过这样一些网站,一进入首页立刻会弹出一个窗口,或者按一个连接或按钮弹出,通常在这个窗口里会显示一些注意事项、版权信息、警告、欢迎光顾之类的话或者作者想要特别提示的信息。其实制作这样的页面效果非常的容易,只要往该页面的HTML里加入几段Javascript代码即可实现。下面俺就带您剖析它的奥秘。


     【1、最基本的弹出窗口代码】
    其实代码非常简单:


    <SCRIPT LANGUAGE="javascript">
    <!--
    window.open ('page.html')
    -->
    </SCRIPT>


     因为这是一段javascripts代码,所以它们应该放在<SCRIPT LANGUAGE="javascript">标签和</script>之间。<!-- 和 -->是对一些版本低的浏览器起作用,在这些老浏览器中不会将标签中的代码作为文本显示出来。要养成这个好习惯啊。
     window.open ('page.html') 用于控制弹出新的窗口page.html,如果page.html不与主窗口在同一路径下,前面应写明路径,绝对路径(http://)和相对路径(../)均可。
     用单引号和双引号都可以,只是不要混用。
     这一段代码可以加入HTML的任意位置,<head>和</head>之间可以,<body>间</body>也可以,越前越早执行,尤其是页面代码长,又想使页面早点弹出就尽量往前放。

     【2、经过设置后的弹出窗口】
     下面再说一说弹出窗口的设置。只要再往上面的代码中加一点东西就可以了。我们来定制这个弹出的窗口的外观,尺寸大小,弹出的位置以适应该页面的具体情况。

    <SCRIPT LANGUAGE="javascript">
    <!--
    window.open ('page.html', 'newwindow', 'height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no')
    //写成一行
    -->
    </SCRIPT>

     参数解释:


    <SCRIPT LANGUAGE="javascript"> js脚本开始;
    window.open 弹出新窗口的命令;
    'page.html' 弹出窗口的文件名;
    'newwindow' 弹出窗口的名字(不是文件名),非必须,可用空''代替;
    height=100 窗口高度;
    width=400 窗口宽度;
    top=0 窗口距离屏幕上方的象素值;
    left=0 窗口距离屏幕左侧的象素值;
    toolbar=no 是否显示工具栏,yes为显示;
    menubar,scrollbars 表示菜单栏和滚动栏。
    resizable=no 是否允许改变窗口大小,yes为允许;
    location=no 是否显示地址栏,yes为允许;
    status=no 是否显示状态栏内的信息(通常是文件已经打开),yes为允许;
    </SCRIPT> js脚本结束

     【3、用函数控制弹出窗口】
     下面是一个完整的代码。
    <html>
    <head>
    <script LANGUAGE="JavaScript">
    <!--
    function openwin() {
    window.open ("page.html", "newwindow", "height=100, width=400, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")
    //写成一行
    }
    //-->
    </script>
    </head>
    <body οnlοad="openwin()">
    ...任意的页面内容...
    </body>
    </html>

     这里定义了一个函数openwin(),函数内容就是打开一个窗口。在调用它之前没有任何用途。
    怎么调用呢?


     方法一:<body οnlοad="openwin()"> 浏览器读页面时弹出窗口;
     方法二:<body οnunlοad="openwin()"> 浏览器离开页面时弹出窗口;
     方法三:用一个连接调用:
    <a href="#" οnclick="openwin()">打开一个窗口</a>
    注意:使用的“#”是虚连接。
     方法四:用一个按钮调用:
    <input type="button" οnclick="openwin()" value="打开窗口">

     【4、同时弹出2个窗口】


     对源代码稍微改动一下:
    <script LANGUAGE="JavaScript">
    <!--
    function openwin() {
    window.open ("page.html", "newwindow", "height=100, width=100, top=0, left=0,toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")
    //写成一行
    window.open ("page2.html", "newwindow2", "height=100, width=100, top=100, left=100,toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")
    //写成一行
    }
    //-->
    </script>


     为避免弹出的2个窗口覆盖,用top和left控制一下弹出的位置不要相互覆盖即可。最后用上面说过的四种方法调用即可。
    注意:2个窗口的name(newwindows和newwindow2)不要相同,或者干脆全部为空。OK?

     【5、主窗口打开文件1.htm,同时弹出小窗口page.html】

     如下代码加入主窗口<head>区:

    <script language="javascript">
    <!--
    function openwin() {
    window.open("page.html","","width=200,height=200")
    }
    //-->
    </script>
    加入<body>区:
    <a href="1.htm" οnclick="openwin()">open</a>即可。

     【6、弹出的窗口之定时关闭控制】

     下面我们再对弹出的窗口进行一些控制,效果就更好了。如果我们再将一小段代码加入弹出的页面(注意是加入到page.html的HTML中,可不是主页面中,否则...),让它10秒后自动关闭是不是更酷了?


     首先,将如下代码加入page.html文件的<head>区:
    <script language="JavaScript">

    function closeit() {

    setTimeout("self.close()",10000) //毫秒

    }

    </script>
     然后,再用<body οnlοad="closeit()"> 这一句话代替page.html中原有的<BODY>这一句就可以了。(这一句话千万不要忘记写啊!这一句的作用是调用关闭窗口的代码,10秒钟后就自行关闭该窗口。)

     【7、在弹出窗口中加上一个关闭按钮】
    <FORM>
    <INPUT TYPE='BUTTON' VALUE='关闭' onClick='window.close()'>
    </FORM>
    呵呵,现在更加完美了!

     【8、内包含的弹出窗口-一个页面两个窗口】

    上面的例子都包含两个窗口,一个是主窗口,另一个是弹出的小窗口。
    通过下面的例子,你可以在一个页面内完成上面的效果。

    <html>
    <head>
    <SCRIPT LANGUAGE="JavaScript">
    function openwin()
    {
    OpenWindow=window.open("", "newwin", "height=250, width=250,toolbar=no,scrollbars="+scroll+",menubar=no");
    //写成一行
    OpenWindow.document.write("<TITLE>例子</TITLE>")
    OpenWindow.document.write("<BODY BGCOLOR=#ffffff>")
    OpenWindow.document.write("<h1>Hello!</h1>")
    OpenWindow.document.write("New window opened!")
    OpenWindow.document.write("</BODY>")
    OpenWindow.document.write("</HTML>")
    OpenWindow.document.close()
    }
    </SCRIPT>
    </head>
    <body>
    <a href="#" οnclick="openwin()">打开一个窗口</a>
    <input type="button" οnclick="openwin()" value="打开窗口">
    </body>
    </html>

     看看 OpenWindow.document.write()里面的代码不就是标准的HTML吗?只要按照格式写更多的行即可。千万注意多一个标签或少一个标签就会出现错误。记得用OpenWindow.document.close()结束啊。


     【9、终极应用--弹出的窗口之Cookie控制】

     回想一下,上面的弹出窗口虽然酷,但是有一点小毛病(沉浸在喜悦之中,一定没有发现吧?)比如你将上面的脚本放在一个需要频繁经过的页面里(例如首页),那么每次刷新这个页面,窗口都会弹出一次,是不是非常烦人?:-(
     有解决的办法吗?Yes! ;-) Follow me.
     我们使用cookie来控制一下就可以了。
     首先,将如下代码加入主页面HTML的<HEAD>区:

    <script>
    function openwin(){
    window.open("page.html","","width=200,height=200")
    }
    function get_cookie(Name) {
    var search = Name + "="
    var returnvalue = "";
    if (document.cookie.length > 0) {
    offset = document.cookie.indexOf(search)
    if (offset != -1) {
    offset += search.length
    end = document.cookie.indexOf(";", offset);
    if (end == -1)
    end = document.cookie.length;
    returnvalue=unescape(document.cookie.substring(offset, end))
    }
    }
    return returnvalue;
    }

    function loadpopup(){
    if (get_cookie('popped')==''){
    openwin()
    document.cookie="popped=yes"
    }
    }

    </script>

     然后,用<body οnlοad="loadpopup()">(注意不是openwin而是loadpop啊!)替换主页面中原有的<BODY>这一句即可。你可以试着刷新一下这个页面或重新进入该页面,窗口再也不会弹出了。真正的Pop-Only-Once

    转载于:https://www.cnblogs.com/ajuanabc/archive/2009/06/29/2463147.html

    展开全文
  • QQ网页弹窗

    千次阅读 2014-12-28 19:24:04
    QQ网页弹窗 1、网址:http://shang.qq.com/v3/index.html 2、选推广工具,提示语随便写 3、建一个html 网页,并把代码拷进去。   4、双击网页,就可以打开了。(用EditPlus编译器Ctrl+B也可以打开。) 把这个...

                    QQ网页弹窗

    1、网址:http://shang.qq.com/v3/index.html

    2、选推广工具,提示语随便写

    3、建一个html 网页,并把代码拷进去。

     


    4、双击网页,就可以打开了。(用EditPlus编译器Ctrl+B也可以打开。)

    把这个网页发给陌生人,陌生人就可以和你进行临时会话


    5、我的代码如下:

     

    <a target="_blank"href="http://wpa.qq.com/msgrd?v=3&uin=2578858653&site=qq&menu=yes">
    <imgborder="0" src="http://wpa.qq.com/pa?p=2:2578858653:51"alt="点击这里给我发消息"title="点击这里给我发消息"/></a> 

    展开全文
  • http: www 52player com WebPlayer 2014 071637 html">仿新浪右下角视频弹窗播放器 视频弹出广告功能可以加视频广告链接 播放器功能 提示:请在IIS下或其它网站环境下测试 : 仿新浪右下角视频弹窗播放器 视频弹...
  • js弹窗提醒经常会在做网页的时候用到,今天来说说js弹窗提醒后怎么自动关闭弹窗实现方法。正常弹窗提醒,我们...首先看下面的弹窗代码:复制成功!弹窗实际效果如下:然后我们这里要做的效果是,复制textarea里的...

    js弹窗提醒经常会在做网页的时候用到,今天来说说js弹窗提醒后怎么自动关闭弹窗实现方法。

    正常弹窗提醒,我们都会用alert();来实现,但是alert();弹窗的缺陷就是无法自动关闭,所以这里我们需要自己做一个弹窗。举例:我们现在来做一个复制网页文本,就弹窗提示复制成功,并2秒后自动关闭弹窗的效果。

    首先看下面的弹窗代码:

    复制成功!

    弹窗实际效果如下:

    c19a0c415775247d7640088976f02332.png

    然后我们这里要做的效果是,复制textarea里的内容后就会弹出复制成功,并在2秒后关闭弹窗。看下面完整代码:

    /*文本框部分*/

    /*弹窗部分*/

    复制成功!

    /*JS部分*/

    function copy() {

    document.getElementById('message').style.display='';   //复制后弹出

    setTimeout("document.getElementById('message').style.display='none'",2000);  //2秒后自动隐藏

    }

    通过以上代码就可以实现复制成功之后,弹出复制成功提醒,2秒后自动关闭提醒弹窗了。

    展开全文
  • 在很多网页都有这样的效果,当点击一个按钮或者其他的对象会弹出一个提示框,如果点击确定则继续执行既定的程序,如果点击取消则会取消继续执行,代码实例如下:确定和取消提示框div{width:150px;margin:0px auto;}a{...

    在很多网页都有这样的效果,当点击一个按钮或者其他的对象会弹出一个提示框,如果点击确定则继续执行既定的程序,如果点击取消则会取消继续执行,代码实例如下:

    确定和取消提示框

    div

    {

    width:150px;

    margin:0px auto;

    }

    a

    {

    font-size:12px;

    color:blue;

    }

    window.οnlοad=function(){

    var mylink=document.getElementById("mytest");

    mylink.οnclick=function(){

    if(confirm("确定要访问吗"))

    {

    return true;

    }

    else

    {

    return false;

    }

    }

    }

    以上代码中,当点击链接会弹出一个提示框,如果点击确定则会访问蚂蚁部落首页,否则不会访问。实现此功能核心是使用了confirm(),参数值是提示框的文本内容。下面就简短介绍一下以上代码的原理:

    一.当点击链接的时候,会调用为a元素绑定的onclick事件处理函数。

    二.在事件处理函数中,由于当点击确定按钮,confirm()会返回true,点击取消则会返回false,那么if语句则会根据confirm()的返回值选择执行if语句还是else语句。

    以上所述就是本文的全部内容了,希望大家能够喜欢。

    展开全文
  • javascript自定义alert弹窗

    万次阅读 2016-04-10 15:18:46
    我们都知道js中的alert有弹窗提示的作用,但它在实践项目中很少使用,原因就是因为长的太难看!那么今天我就给大家讲一下如何来美化这个系统自带的alert!详细代码如下: <!DOCTYPE html> <html lang="zh-cn"> 教...
  • 很多网页都有右下角弹窗,比如广告或者一些提示框,那么如何用JS达到一种滑动条移动时,弹窗逐渐移动的效果。 首先这种效果可以叫做缓冲运动,其速度会随着元素与目标点距离而变慢。 我们看看代码: <!DOCTYPE ...
  • 弹窗代码经常上网的朋友可能会到过这样一些网站,一进入首页立刻会弹出一个窗口,或者按一个连接或按钮弹出,通常在这个窗口里会显示一些注意事项、版权信息、警告、欢迎光顾之类的话或者作者想要特别提示的信息。...
  • 否则预览看到的是整个网页,而不是指定的frame window.frames['myifrm'].focus(); //pazu.TPrinter.doPreview();//打印预览 pazu.TPrinter.doPrint(isPromtUser); }); }); Html...
  • 学生在线网课网页设计网页知识点网页作品介绍网页代码展示代码展示登录页面部分代码展示头部区域代码演示小导航代码演示网页效果预览首页效果表单页面详情页面作品地址 网页知识点 DIV CSS布局、CSS3效果(阴影、...
  • “HMTL一键打包APK工具”可以把网站打包为一个安卓应用APK文件,无需编写任何代码,支持在安卓设备上安装运行。 线上地址: 点击进入页面 历史更新 1.4.5 (2020.2.16) 1. 优化打包逻辑,添加内核标注 2....
  • JavaScript实现输入对话框的代码发布时间:2020-05-18 11:36:45来源:亿速云阅读:438作者:小新我们有时在网页上进行注册用户信息时会出现弹窗进行提示,你需要输入内容进行确认,那么,这样的输入对话框是怎么实现...
  • jsp弹出新窗口代码

    万次阅读 2010-04-15 17:27:00
    各类网页弹窗代码编写 经常上网的朋友可能会到过这样一些网站,一进入首页立刻会弹出一个窗口,或者按一个连接或按钮弹出,通常在这个窗口里会显示一些注意事项、版权信息、警告、欢迎光顾之类的话或者作者想要特别...
  • 网页自动点击监控工具

    热门讨论 2012-11-03 12:07:03
    网页自动点击监控工具模拟人工网页点击操作,同时监控...8、实现网页整体监控、HTML元素监控、源代码监控。 9、多种报警处理方式:声音报警、弹窗报警、触发新任务或第三方程序 10、支持定时任务,程序可后台隐藏执行
  • 如何在word中插入代码

    2021-05-12 18:49:12
    1.将你需要插入在word中的代码完整的复制到该网站提示的文本框内,选择你的代码类型,如C,C++,HTML等,并点击提交(出现弹窗关注点确认即可)。如下图: 2.该网页会自动将该代码生成到一个新的页面,此时ctrl+A全选...
  • JAVASCRIPT学习

    2021-03-19 00:00:36
    JAVASCRIPT学习 作用 ...alert() 警示弹窗 confirm() 确认弹窗 prompt() 提示弹窗 结构 Javascript分为DOM和BOM DOM //源码已完成 在html界面进行操作 本质:连接web页面和编程语言 文档对象模型 javas
  • 表单自动填写,网页自动提交工具

    千次下载 热门讨论 2012-11-06 10:02:04
    模拟人工提交网页表单操作,同时监控提交结果变化并报警...7、实现网页整体监控、HTML元素监控、源代码监控。 8、多种报警处理方式:声音报警、弹窗报警、触发新任务或第三方程序 9、支持定时任务,程序可后台隐藏执行
  • ie浏览器弹窗提示:Internet Explorer 已限制此网页运行脚本或者ActiveX控件 解决办法: 在页面html开始标签和head开始标签中间新增一行,添加以下代码: <!-- saved from url=(0014)about:internet --> IE不...
  • Android Studio笔记之webview 基本语法 实战演练 1.加载本地html 项目结构 注意路径写法 2.加载网络html 解决点击页面内链接提示打开浏览器问题 解决返回键退出...使用js实现弹窗 以上对应的代码:** ...
  • 1.app多语言测试中,弹窗一般会出现居中问题。德语和法语容易在按钮和固定大小的控件上超出长度 2.web测试中,对各个输入框的报错提示可能会有重叠情况。 3.自动化测试中,页面如果刷新了,控件就得重新定位。...
  • 其实很简单,都是基本要求,麻烦哪位大虾帮帮忙,谢谢 ...2.小明同学给添加按钮添加点击事件,并判读两个输入框的值不能为空,如果两个输入框有一个值为空的话以弹窗提示: 请输入添加网站所需内容。
  • ActiveX开发入门

    2019-12-11 19:24:15
    1、新建ActiveX项目,一路默认下来,在 视图->类视图 下的目录结构是这样的: 添加ShowTest()方法给外部js调用,返回值和参数都为空。 ...完成后全局搜索ShowTest函数,在内部...网页代码 <html> ...
  • 核心语法为math中随机数的使用 利用随机数字来实现随机的数字 字符 汉字 ,利用字符串的拼接来实现随机字体大小、旋转角度和各种颜色,利用css样式来禁止从网页上复制和粘贴,最后用弹窗来实现验证结果提示。...
  • 一个简单的CSS弹出窗

    2015-07-13 22:24:12
    大家在浏览网页的时候就会遇到某些提示信息或者是警告信息,这些信息也往往是以弹出窗的形式出现的。这些弹出窗口也往往是以浏览器默认的样式出现的,各个浏览器或者是手机网站渲染的效果也往往不同。下面做一个统一...

空空如也

空空如也

1 2 3
收藏数 45
精华内容 18
关键字:

html网页提示弹窗代码