自动改变键值位置的软键盘

Posted by admin

Dec 28

因为一个项目需要,客户要求输入密码时采用软键盘方式,并且每次刷新,软键盘上的键值的位置都会不同.和农行的那个类似的.

首先打开农行分析,发现他是通过动态生成软键盘位置的图片,然后采用热点的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

  • Tags: JavaScript, 作品, , .

    • 圣诞节网页下雪代码

    Posted by admin

    Dec 27

    嘿嘿,老婆老是说为啥还不下雪呢,都梦到几次下雪了,俺在网上找到了这个代码,JAVASCRIPT写的.很牛X,效果很不错哦...

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

    调用方式为

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

    • 不提示直接关闭浏览器

    Posted by admin

    Dec 25

    用JS代码可以实现这个效果，代码如下：
    <script language="javascript">
    window.opener=null;
    window.close();
    </script>如果网页是在框架内，则用以下代码：
    <script language="javascript">
    window.parent.opener=null;
    window.parent.close();
    </script>

  • Tags: JavaScript, , , , .