越狱下载\越狱第二季\兴化沙沟\友情链接\美女图片\矢量下载\韩国像素,SOSOTOT'蛰伏沙龙
  2003-09-25
  沙沟主题站
  越狱全图文
 

热门专题

  会员中心
  杀毒不求人
  友情链接
加入收藏夹
  2006-10-15
网站首页
低价游戏点卡热卖
免费得Q币方法大全
在线收看电视剧电影
暴雪游戏中文网
我们的网络小美女
 
| 沙沟主题网 | 平面设计交流 | 摄影图片欣赏 | 游戏杂谈专题 | 网络娱乐快报 | 软件下载介绍 | 股票投资指南 | 混迹网络指导 | 我们的论坛
www.sosootot.com
   
 当前位置:蛰伏沙龙首页>平面设计交流>网页制作技巧>文章内容 
  | 文章标题:input输入框的各种样式  
 
input输入框的各种样式
来源:蛰伏沙龙 www.sosotot.com 作者:沙沟主题网225777.com 发布时间:2008-03-19  
              WWW.SOSOTOT.COM | 蛰伏沙龙 | 网站版权说明 盗用必究

 输入框景背景透明:
<input style="background:transparent;border:1px solid #ffffff">
鼠标划过输入框,输入框背景色变色:
<INPUT value="Type here" NAME="user_pass" TYPE="text" SIZE="29" onmouseover="this.style.borderColor='black';this.style.backgroundColor='plum'"
style="width: 106; height: 21"
onmouseout="this.style.borderColor='black';this.style.backgroundColor='#ffffff'" style="border-width:1px;border-color=black">

输入字时输入框边框闪烁(边框为小方型):
<Script Language="JavaScript">
function borderColor(){
if(self['oText'].style.borderColor=='red'){
self['oText'].style.borderColor = 'yellow';
}else{
self['oText'].style.borderColor = 'red';
}
oTime = setTimeout('borderColor()',400);
}
</Script>
<input type="text" id="oText" style="border:5px dotted red;color:red" onfocus="borderColor(this);" onblur="clearTimeout(oTime);">

输入字时输入框边框闪烁(边框为虚线):
<style>
#oText{border:1px dotted #ff0000;ryo:expression(onfocus=function light (){with(document.all.oText){style.borderColor=(style.borderColor=="#ffee00"?"#ff0000":"#ffee00");timer=setTimeout(light,500);}},onblur=function(){this.style.borderColor="#ff0000";clearTimeout(timer)})};
</style>
<input type="text" id="oText">

自动横向廷伸的输入框:
<input type="text" style="huerreson:expression(this.width=this.scrollWidth)" value="abcdefghijk">

自动向下廷伸的文本框:
<textarea name="content" rows="6" cols="80" onpropertychange="if(this.scrollHeight>80) this.style.posHeight=this.scrollHeight+5">输入几个回车试试</textarea>

只有下划线的文本框:
<input style="border:0;border-bottom:1 solid black;background:;">

软件序列号式的输入框:
<script for="T" event="onkeyup">
if(value.length==3)document.all[event.srcElement.sourceIndex+1].select();
</script>
<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T7" size="5" maxlength="3">

软件序列号式的输入框(完整版):
<script for="T" event="onkeyup">if(value.length==maxLength)document.all[event.srcElement.sourceIndex+1].focus();</script>
<script for="T" event="onfocus">select();</script>
<script for="Submit" event="onclick">
var sn=new Array();
for(i=0;i<T.length;i++)
sn=T.value;
alert(sn.join("—"));
</script>
<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">—<input name="T" size="5" maxlength="3">
<input type="submit" name="Submit">

 



              WWW.SOSOTOT.COM | 蛰伏沙龙 | 网站版权说明 盗用必究
 
上一篇:LOGO设计趋势报告   下一篇:令脑贵庚在线小游戏
[收藏] [推荐] [评论(0条)] [返回顶部] [打印本页] [关闭窗口]  
用户名: 新注册) 密码: 匿名评论
评论内容:(不能超过250字,需审核后才会公布,请自觉遵守互联网相关政策法规。
 
越狱下载\越狱第二季\兴化沙沟\友情链接\美女图片\韩国像素 www.sosotot.com 蛰伏沙龙
  | 看官区
沙沟论坛
聊聊沙沟吧
 
沙沟QQ群
27271764
  | 火热放送
沙沟发展大讨论
在线看电视电影
Google
  | 看沙沟


  | 热点文章推荐
·HTML语言frame的使用|if
·网页广告标准尺寸|网页
·国外404页面设计全收集
·Banner 设计手册
·网页制作常见105个问题
·CSS实用使用技巧20则
·Exploring Design: Outs
·50 Beautiful CSS-Based
  | 相关文章推荐
·web2.0色系
·二十六步获得网站流量
·DIV+CSS 命名规范|DIV网
·DIV+CSS 布局入门|DIV
·按钮加链接|web页面按钮
·HTML语言frame的使用|if
·网站设计65条原则
·网页广告标准尺寸|网页
 

越狱下载\越狱第二季\兴化沙沟\友情链接\美女图片\韩国像素 www.sosotot.com 蛰伏沙龙
SOSOTOT'蛰伏沙龙
[将本站加入收藏夹]
建議使用IE4.0以上版本
及1024*768解析度瀏覽本網站
关于我们 | 网站导航 | 商务合作 | 合作伙伴 | 广告加盟 | 网站留言 | 免责申明
SOSOTOT.COM | Copyright SOSOTOT Inc All Rights Reserved ,2006  沪ICP备06060359号
特别声明:本站内容多为互联网收集,如有侵犯您的权益,请速与我们联系。E-mail:sosotot@gmail.com