实现网页弹出窗口


图片热点实现超链接,控制弹出窗口。

  • 控制弹出窗口的页面代码:

<script type="text/javascript">
 function pp(){

   var open=window.open("new.html","New","height=200,width=400");//控制窗口弹出,参数为弹出窗口的链接、title及窗口的大小

    width=screen.width; //获取用户屏幕大小
    height=screen.height; 

    open.moveTo((width-200)/2,(height-400)/2); //控制弹出窗口居中显示
 }
</script>


<h2>测试广告的弹出页面</h2>

<div id="img">

 <img src="../images/back.jpg"  usemap="#map" /> //插入图片,设置usemap属性指定触发事件图片id
   <map id="map">

//shape指定点击范围的形状为圆,coords为圆心横纵标及半径,以图片的左上为原点

      <area shape="circle" coords="410,260,200" οnclick="pp()" />
   </map>
 </div>


  • 弹出窗口代码

<script type="text/javascript">

 function checkpost(){   
     if(form.user.value==""){ //验证表单用户名是否为空
         alert("请填写用户名");
         p.user.focus();   //指定光标位置
         return flase;    //返回一个错误
         }
   if(form.pwd.value==""){
        alert("请填写密码");
        p.pwd.focus();
        return flase;
        }
    return true;  //通过验证
     }
</script>

<h4 >用户登录</h4>
  <div id="text">
  <form name="form" method="post" οnsubmit="return checkpost();">

      用户名:<input type="text" id="user" /> </br></br>

      密&nbsp;&nbsp;&nbsp;码:<input type="text" id="pwd" /></br></br>
    <button >登录</button>   

</form>

</div>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值