lixiaopeng's blog » JavaScript http://www.lixiaopeng.org 这个世界好YD! Wed, 14 Jul 2010 21:21:08 +0000 http://wordpress.org/?v=2.9.2 en hourly 1 自动改变键值位置的软键盘 http://www.lixiaopeng.org/automatic-key-to-change-the-location-of-the-soft-keyboard/ http://www.lixiaopeng.org/automatic-key-to-change-the-location-of-the-soft-keyboard/#comments Sun, 28 Dec 2008 10:41:03 +0000 admin http://www.lixiaopeng.org/?p=503 因为一个项目需要,客户要求输入密码时采用软键盘方式,并且每次刷新,软键盘上的键值的位置都会不同.和农行的那个类似的.

首先打开农行分析,发现他是通过动态生成软键盘位置的图片,然后采用热点的MAP实现的,没法直接利用了.

如按这个仿做的话,要在服务端进行开发了,可用性不好,对于HTML的时候就不能用了,放弃之..

在网上找了下,找到一个实现位置改变的,但效果不好,不过原理可以用一下,然后就按他的原理写了一个,功能强了一些..

键值可以直接在JS文件中添加,很方便,只需要用逗号隔开即可

调用方式

<!--
#keywords{position: absolute;padding:7px;width:500px;height:180px;display:none;border: 1px solid #3026A6;background-color:#FFFFFF;}
.key{float:left;margin:5px;border: 1px solid #3026A6;}
#keywords a{padding:4px 8px;text-decoration:none;line-height:2;font-size:12px;font-family:verdana;color:#3026A6;}
#keywords a:hover{background-color:#A09AE9;}
-->
 
<script src="KeyWords.js" type="text/javascript"><!--mce:0--></script>
 
<input id="password" onclick="SetKeyWords(this);" name="password" type="text" />

修改CSS可以得到更好的效果

演示地址:http://www.lixiaopeng.org/blog/wp-content/uploads/2008/12/keywords/

下载地址:http://www.lixiaopeng.org/blog/wp-content/uploads/2008/12/keywords.rar

因个人能力有限,可能会在存问题,欢迎到我的BLOG提出,地址是http://www.lixiaopeng.org

您可能对以下文章有兴趣↓

]]> http://www.lixiaopeng.org/automatic-key-to-change-the-location-of-the-soft-keyboard/feed/ 8 圣诞节网页下雪代码 http://www.lixiaopeng.org/christmas-snow-page-code/ http://www.lixiaopeng.org/christmas-snow-page-code/#comments Sat, 27 Dec 2008 15:28:45 +0000 admin http://www.lixiaopeng.org/?p=499 嘿嘿,老婆老是说为啥还不下雪呢,都梦到几次下雪了,俺在网上找到了这个代码,JAVASCRIPT写的.很牛X,效果很不错哦...

有风吹和雪花堆落的效果.

调用方式为

<script type="text/javascript" src="script/snowstorm.js"></script>
程序页面:http://www.schillmania.com/projects/snowstorm/
这个页面还有别的效果哦,很不错的,你把鼠标移到那个彩灯灯头那里试试,很好玩哇.

您可能对以下文章有兴趣↓

]]> http://www.lixiaopeng.org/christmas-snow-page-code/feed/ 0 不提示直接关闭浏览器 http://www.lixiaopeng.org/did-not-directly-prompt-the-closure-of-the-browser/ http://www.lixiaopeng.org/did-not-directly-prompt-the-closure-of-the-browser/#comments Thu, 25 Dec 2008 10:58:30 +0000 admin http://www.lixiaopeng.org/?p=485 用JS代码可以实现这个效果，代码如下：
<script language="javascript">
window.opener=null;
window.close();
</script>如果网页是在框架内，则用以下代码：
<script language="javascript">
window.parent.opener=null;
window.parent.close();
</script>

您可能对以下文章有兴趣↓

]]> http://www.lixiaopeng.org/did-not-directly-prompt-the-closure-of-the-browser/feed/ 0