仿网易“邮箱克隆”弹出窗口效果

转载 2006年06月22日 15:47:00

一直使用发现163的邮箱中ajax应用相当完美,特别是邮箱克隆中弹出窗口效果,简直就是模拟软件,很酷!可不知道代码是怎么写的,没来得及研究。今天偶然在javascript论坛看到有人贴出了代码,便收藏了。

< html >
< head >
< meta  http-equiv ="Content-Type"  content ="text/html; charset=gb2312" >
< title > 弹出特效 </ title >
</ head >
< script >
var  falpha= 0
function  fchange(){
if  (falpha != 90 ){
        table1.style.filter
= " alpha(opacity= " + falpha + " ) " ;
        falpha
= falpha + 10 ;
        setTimeout(
" fchange() " , 200 )
        }
else  { falpha = 0 ;
    }
}
function  sss(){
        table1.style.height
= (window.document.body.clientHeight > window.document.body.scrollHeight) ? window.document.body.clientHeight:window.document.body.scrollHeight;
        table1.style.width
= " 100% " ;
        table1.style.display
= 'block'
        table2.style.left
= window.document.body.scrollWidth / 2 - 100 ;
        table2.style.top
= window.document.body.offsetHeight / 2 - 100
        table2.style.display
= 'block'
        fchange()
}

function  freset(){
table1.style.display
= 'none'
table2.style.display
= 'none'
}

</ script >
< body  topmargin =0  leftmargin =0  bgcolor =yellow  style ="display:block;" >
< table  id ="table1"  style =" background='#FFFFFF'; display: none;position: absolute;z-index=1;filter:alpha(opacity=90)"  oncontextmenu ="return false" >
< tr  width =100%  height =100% >
< td >

</ table >

< table  oncontextmenu ="return false"  id ="table2"  border ="2"  style ="background='#E1E100'; borderColor=red; display: none; position: absolute;z-index=2;width:200;height:100;"  cellspacing ="0"  cellpadding ="0"  bordercolor ="#800000" >
< tr  width =150  height =20 >
< td  align ="right"  borderColor ="#E1E100" >
< input  type ="button"  onclick ="freset()"  value ='确定' >
</ td >< td  borderColor ="#E1E100" >< input  type ="button"  onclick ="freset()"  value ='取消' ></ td >
</ tr >
</ table >
< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >< br >

< p >< br >< br >< br >< br >
< input  type ="button"  onclick ="sss()"  value ='申请提交' >
</ p >

</ body >
</ html >

其基本思想是:
设定一个表格a1,并且z-index为1,并且为绝对定位。开始把其display设为none,然后设定一个隐藏的模拟的弹出窗口a2,z-index为2,显示属性设为none,在页面中添加一个按钮激活事件,然后把a1的display设为block,宽高都设为100%,并调节其透明度;因为display=block,z-index=1这样它就覆盖了原页面的内容使其不能编辑。点击模拟窗口中按钮激活复原属性,把a1,a2显示都设为none.

仿网易选项卡的实现

android 选项卡
  • kongchengjiumenghx
  • kongchengjiumenghx
  • 2016年03月05日 23:19
  • 332

模仿163邮箱注册密码校验demo

密码强度demo               密码                                                         ...
  • weixin_34902467
  • weixin_34902467
  • 2016年12月01日 13:52
  • 336

高仿网易新闻栏目动画效果

tyktfj0910 的博客地址:http://blog.csdn.net/tyk0910 效果预览 今天准备用RecyclerView来实现网易新闻Tabs的动态效果...
  • scott2017
  • scott2017
  • 2016年05月30日 09:40
  • 1007

【FastDev4Android框架开发】Android Design支持库TabLayout打造仿网易新闻Tab标签效果(三十七)

(一).前言:             仿36Kr客户端开发过程中,因为他们网站上面的新闻文章分类比较多,所以我这边还是打算模仿网易新闻APP的主界面新闻标签Tab以及页面滑动效果来进行实现。要实现的...
  • jiangqq781931404
  • jiangqq781931404
  • 2015年12月03日 12:23
  • 7616

仿网易新闻标签选择器(可拖动)-TabMoveLayout

仿网易新闻标签栏-TabMoveLayout网易新闻标签栏的实现效果我一直想实现试试,最近发现支付宝的应用栏也变成了这样,最近花了点时间终于实现,初步实现效果如下,后面有时间还会继续完善 实现功能1...
  • sdfdzx
  • sdfdzx
  • 2017年04月18日 18:12
  • 613

div+css仿163选项卡的简单版

 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">http://www.w3.org/1999/xhtml">标准布局应用:选项卡/* 选项卡关...
  • shulei521
  • shulei521
  • 2007年10月05日 06:17
  • 1642

高仿网易评论列表效果之数据准备

上一篇文章我们分析了网易评论列表的界面效果
  • aigestudio
  • aigestudio
  • 2014年11月15日 10:32
  • 9326

仿网易新闻评论的楼层效果

仿网易新闻评论 评论楼层效果
  • u013435893
  • u013435893
  • 2016年03月31日 09:48
  • 1986

163企业免费邮箱嵌入网站代码

                               
  • liuyunfan
  • liuyunfan
  • 2010年12月24日 00:34
  • 4361

仿网易新闻的顶部导航指示器

使用HorizontalScrollView打造自己的页面导航器( Navigator)我们知道,页面导航器(Navigator)在几乎所有的项目中都会用到,平时大多数时候为了节省时间,都会直接在gi...
  • gdutxiaoxu
  • gdutxiaoxu
  • 2016年07月31日 23:12
  • 6128
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:仿网易“邮箱克隆”弹出窗口效果
举报原因:
原因补充:

(最多只允许输入30个字)