Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >试试Konami Code的神奇

试试Konami Code的神奇

作者头像
XiaoA
发布于 2023-05-24 05:58:18
发布于 2023-05-24 05:58:18
26400
代码可运行
举报
运行总次数:0
代码可运行

何为Konami Code,不如你先在在Google Reader上试下,在空白的地方点下,然后键盘输入 Up, Up, Down, Down, Left, Right, Left, Right, B, A,看看页面有什么变化,这个秘语来源于魂斗罗”中的“秘技”,这个就称为“Konami Code”,如图所示:

    在FaceBook也能看到这样的彩蛋效果,不过在这里,你还是看看Google Reader吧!

    试着在网上找了些这方面的资料,通过Javascript实现的代码也很多,在网上找到了怎么样实现这样的神奇效果,也提出了多种代码实现,我就试着用了那个简单的代码在WordPress里面,用过Jquery后的实现如下:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var k = [];
$(document).keydown(function(e) {
       e = e || window.event;
       k.push(e.keyCode);
       if (k.toString().indexOf("38,38,40,40,37,39,37,39,66,65") >= 0) {
            $('#sidebar').animate({
                opacity: 0
            }, 800).animate({
                opacity: 1
            }, 800);
            k = [];
        }
});

这段代码呢还是有些问题,如果“秘技”一直不对,数组k则一直增加,所以我又将代码改了一下,判断如果k的数量==10了,还不正确就去掉第一个,保证k里面最多只有10个,不会一直增加下去,如下:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
var k = [];
$(document).keydown(function(e) {
     e = e || window.event;
     k.push(e.keyCode);
     if (k.toString().indexOf("38,38,40,40,37,39,37,39,66,65") >= 0) {
         $('#sidebar').animate({
              opacity: 0
         }, 800).animate({
              opacity: 1
         }, 800);
         k = [];
     }
     else if (k.length == 10) {
         k.shift();
     }
});

你现在就可以试试,页面会有什么效果!这个效果在所有wordpress都能使用(sidebar),直接加入代码在你的header模版里就可以看到侧栏的呼吸效果了!

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2012-04-30,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
M3U8在线播放
当我们在网上愉快观影的时候,难免会遇到“M3U8格式”的视频。聪明的你应该也发现了,它是没办法直接播放的。它其实只是一个索引文件,根据它找到相应的.ts文件再进行播放。而这样做的好处,大概就是做多码率适配,保证视频播放的流畅性。有感兴趣的小伙伴可以参看这里—>M3U8文件格式。
全栈程序员站长
2022/07/02
10.3K0
M3U8在线播放
JQ俄罗斯方块儿
jquery方便简单,下载后受益无穷,今天翻了翻官方网站,发现 Download 页面没有一个能打开的,我想上传一个 jquery 文件,没想到也被人捷足先登了,要31块钱才能下一次。我找了两天,终于找到了一个v3.5.1 的网络地址,大家老方法,拷贝下直接打开就能玩了。 不会拷贝点这里
我不是费圆
2020/10/09
4680
听说最近HTML5很火~~!---贪吃蛇小游戏
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>贪吃蛇</title> <style type="text/css"> *{margin:0;padding: 0;font-family: "Microsoft YaHei";} #page{margin-right: auto;margin-left: auto; margin-top: 20px;height: 600px; width:
赵腰静
2018/03/09
8390
三级侧边栏-树形菜单案例效果
效果图: 本次制作要点: html: 结构上,要把li内部的文字和待展开的元素分开来,便于后期样式上的把控和逻辑上的处理。 1 <div class="sidebar-list"> 2
xing.org1^
2018/05/17
5K0
jQuery 实现图片下载代码jQuery 实现图片下载代码
jQuery 实现图片下载代码 function downloadImage(src) { var $a = $("<a></a>").attr("href", src).attr("download", "meitu.png"); $a[0].click(); } 关键调用downloadImage函数代码 onclick=downloadImage(url) 完整 js 代码 $(function () { $.extend($.fn.bootstrapTable.defaul
一个会写诗的程序员
2018/08/17
7K0
键盘事件 和键码
<script type="text/javascript" language=JavaScript charset="UTF-8"> document.onkeydown=function(event){ var e=event||window.event||arguments.callee.caller.arguments[0]; if(e && e.keyCode==27){ // 按 Esc //要做的事情
连小壮
2018/08/31
1.7K0
键盘事件 和键码
JS打砖块,童年的回忆
打砖块 —— 敲碎屏幕奖励一百块 睿智的程序员,你有想过自己写一个H5小游戏吗? 打砖块大家都不陌生吧,写一个给孩子玩吧! <!DOCTYPE html> <html> <head> <
我不是费圆
2020/09/21
1.4K0
JS打砖块,童年的回忆
js+jquery实现贪吃蛇经典小游戏
恩爸编程
2024/11/27
2570
js+jquery实现贪吃蛇经典小游戏
第61天:json遍历和封装运动框架(多个属性)
 var json = {width:200,height:300,left:50} console.log(json.width); for(var k in json) { console.log(k);   // k 遍历的是json  可以得到的是  属性 console.log(json[k]);  // json[k]  得到 是属性的  值 }
半指温柔乐
2018/09/11
6790
第61天:json遍历和封装运动框架(多个属性)
JavaScript(进阶)
正则用来定义一些字符串的规则,程序可以根据这些规则来判断一个字符串是否符合规则, 也可以将一个字符串中符合规则的内容提取出来。
神葳
2021/01/22
1.6K0
无聊的人用JS实现了一个简单的打地鼠游戏
如果点击颜色比较深的那个(俗称坏老鼠),将扣分50;如果点击颜色比较浅的那个(俗称好老鼠),将得分100
书童小二
2018/09/03
1.9K0
无聊的人用JS实现了一个简单的打地鼠游戏
第53天:鼠标事件、event事件对象
-->鼠标事件 -->event事件对象 -->默认事件 -->键盘事件(keyCode) -->拖拽效果
半指温柔乐
2018/09/11
1.1K0
EasyUI----EasyUI-Tree联想加模糊查询
最近做的项目中用到了EasyUI的Tree,树的结构是这样的,有22个车站,每一个车站相当于一个逻辑域(虚拟域),每一个域下有许多的设备类型,拿我现在做的门禁系统来说,设备类型有门禁主控制器和门禁就地控制器等设备类型,每一种设备类型下面会有多个设备,每一个车站可能会有好几十个设备,22个车站就可能会有上百个或者上千个设备,这样在加载成Tree后,比如说想要查看文锦站的A站口的门禁就地控制器的信息,要是让你一个节点一个节点的打开去找,肯定会烦死的,所以我们就做了一个(联想+模糊)查询。
令仔很忙
2018/09/14
2.5K0
c# winform快捷键实现
你会注意到keyup和kedown事件的修饰符是protected,为什么要用protected呢?是因为窗体的一些输入控件的按键事件是不会传递到窗体的,比如textbox这些,所有需要手动指定一下
冰封一夏
2019/09/10
1.1K0
JavaScript 中提供的所有键盘按键和按键代码
现代浏览器标准中已不再使用keyCode属性,而改用event.key,但是掌握常用按键及其传统keyCode值对我们的日常开发仍会有很大的帮助,本文分享了JavaScript 中提供的所有键盘按键和 keyCode值。
Power
2025/03/31
2720
键盘code表
键盘code表,供自己查询,免去console.log出code,然后再写的麻烦。
老猫-Leo
2023/12/11
2350
js中的事件(event)
我们可以简单的把事件理解为浏览器的感知系统。比如说:他可以感觉到用户是否点击(click)了页面、鼠标是否进入了页面的某个元素上面(mouseover或mouseenter)、鼠标是否离开了网页(mouseout或mouseleave)、浏览器是都加载完了页面上的资源(window.onload)、文档树是否生成(DOMContentLoaded)、键盘上的某个键是否按下(keydown)、鼠标的滚轮是否滚动了等等。
山河木马
2019/03/05
7.3K0
简书搜索自动匹配功能
今天周六,我又来分享知识啦。最近一直在忙项目,所以趁着这个周末,喝着咖啡,听着音乐,敲着代码就把做项目的知识点总结给大家,简直不要太惬意,哈哈。
wblearn
2018/08/27
1.8K0
简书搜索自动匹配功能
前端学习(53)~键盘事件
onmousewheel:鼠标滚轮滚动的事件,会在滚轮滚动时触发。但是火狐不支持该属性。
Vincent-yuan
2020/03/19
1.1K0
增强型的 <input type=number>
input 标签的 number 类型提供了一种处理数字的好方法。 我们可以使用min和max属性设置界限,并且可以通过向上和向下键来添加或减少1,如果设置step属性,则向上或向下键来添加或减少对应的 step 值。 但是,如果我们想让用户以不同的step上下移动,该怎么办?
前端小智@大迁世界
2020/08/25
6900
相关推荐
M3U8在线播放
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验