JS 网页彩蛋

今天看了

JavaScript 实现 Konami Code

这篇文章之后感觉挺有意思的,就自己写了个网页彩蛋 原文提供的代码很简洁,实际使用中自己又增加了一点控制部分,
比如 显示一定时间后消失,刷新之后清空变量值,重新开始记录键值。
程序的原理就是检测按键的键值,当达到预定条件时执行规定的函数。
贴一下代码和注释:
function  trick(e){
        
if ( typeof  window.k == " undefined " ){
            window.k
= ""
        }
        
var  e = e || event;
        
// alert(e.keyCode);
         if (e.keyCode == 116 ) window.k = "" // F5 清空重新计数
        window.k += e.keyCode + " , " ;
        
if (window.k == " 38,38,40,40,37,37,39,39, " ) {
            play();
            window.k
= "" // 执行play 同时清空
        }        
    }
    
    
function  play(){
        
var  bdy = document.getElementsByTagName( " body " )[ 0 ];
        
var  p = bdy.getElementsByTagName( " p " )[ 0 ];
        
var  h1 = document.createElement( " h1 " );
        h1.innerHTML
= " Hello!!!!! " ;
        bdy.className
= " bg " ;
        p.style.display
= " none " ;
        bdy.appendChild(h1);
        window.setTimeout(
" clean() " , 5000 );  // 延时清理
    }
    
function  clean(){  // 恢复页面
         var  bdy = document.getElementsByTagName( " body " )[ 0 ];
        
var  p = bdy.getElementsByTagName( " p " )[ 0 ];
        bdy.className
= "" ;
        p.style.display
= "" ;
        
var  h1 = bdy.getElementsByTagName( " h1 " )[ 0 ];
        bdy.removeChild(h1);
    }
    
    document.onkeydown
= trick;  // 记录键值执行函数

转载于:https://www.cnblogs.com/trance/archive/2009/09/03/1559520.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值