实现鼠标移入时显示颜色,移出后颜色逐渐变成白色
/**
* @author Yaojianzhou
*/
//颜色类
function Color(r,g,b){
this.r=r;
this.g=g;
this.b=b;
}
//颜色10转16进制
Color.prototype.toString=function(){
var sr=this.r.toString(16);
var sg=this.g.toString(16);
var sb=this.b.toString(16);
if(sr.length==1){sr="0"+sr;}
if(sg.length==1){sg="0"+sg;}
if(sb.length==1){sb="0"+sb;}
var color="#"+sr+sg+sb;
return color;
}
function setbg(el,color){
if(color instanceof Color){
el.style.backgroundColor=color.toString();
}
}
//淡出功能利用setInterval无限调用直到颜色为白色,清除interval
function fadeOut(el,color){
//在页面中可以创建以下3个div用来观察值的变化
//var resultr=document.getElementById("resultr");
//var resultg=document.getElementById("resultg");
//var resultb=document.getElementById("resultb");
var interval=setInterval(function(){
el.style.backgroundColor=color.toString();
if(color.r<255)
color.r++;
if(color.g<255)
color.g++;
if(color.b<255)
color.b++;
if(color.r==255&&color.g==255&&color.b==255)
clearInterval(interval);
},10);
}
//初始化函数,在body的onload中添加
function init(){
var links=document.getElementsByTagName("a");
for(var i=0;i<links.length;i++){
var link=links[i];
link.onmouseover=function(){
this.color=new Color(0,255,0);//给link对象添加color属性
setbg(this,this.color);
};
link.onmouseout=function(){
fadeOut(this,this.color);
};
}
}
分享到:
相关推荐
在本文中,我们将探讨"JS褪色技术实现"这一主题,它通常指的是利用JavaScript来实现页面元素的渐变效果,如淡入淡出、颜色过渡等。 在前端开发中,CSS3提供了动画和过渡效果,但早期的浏览器不支持或支持有限,此时...
4. **耐用性与耐候性**:IT设备标记笔通常需要具备良好的耐久性和耐候性,以确保标记不会因时间、温度、湿度变化而褪色或模糊。 5. **颜色编码**:颜色编码是标记笔在IT领域的另一个重要应用。不同颜色代表不同的...
这类产品通常具备耐久性,能够抵抗环境因素如湿度、温度变化、磨损和褪色,以保持长期清晰的标签。材料可以是不干胶纸、合成塑料或特殊防水材质,以适应不同的工作环境。此外,它们通常配备有可定制的打印模板,可以...
- **鲁棒性**:系统需要对磨损、褪色、新旧标记的差异以及非标准标记有较好的识别能力。 6. **实际应用**: 这些技术不仅应用于自动驾驶汽车,还用于智能交通监控系统,提供实时交通状况分析,辅助交通管理和规划...
行业分类-外包设计-具有在预定温度部分褪色、显示标记的有色元件的包装材料以及生产该材料的方法的介绍分析.rar
1. **证券纸的特性**:证券纸因其耐久性和抗褪色性而在建筑行业中被广泛使用。它具有较高的纤维含量,使得其更坚韧,不易破损。此外,证券纸的微孔结构有助于防止墨水渗透,确保打印图像清晰,色彩持久。 2. **彩色...
传统的细胞标记方法,如荧光素、有机染料等,存在亮度低、易褪色、光毒性等问题。而半导体量子点则克服了这些缺点,它们可以发出强烈的荧光,且荧光寿命长,能进行多色标记,极大地提高了成像的分辨率和灵敏度。 在...
例如,`<h1>`到`<h6>`用于创建不同级别的标题,`<a>`用于创建链接,`<img>`用于插入图像,`<div>`用于创建分组内容的容器,而`<table>`则用于创建表格。 学习HTML时,了解基本元素的用法至关重要。例如,`<b>`使...
其次,激光标记不会像传统的打印或喷墨方式那样随着时间褪色或脱落,确保了信息的长期可读性。此外,这种材料还可能具备耐高温、抗化学腐蚀、防紫外线等特性,适应各种环境条件下的应用。 在电子政务的背景下,电线...
1. 施工现场管理:在施工过程中,褪色笔可以用来在材料表面进行临时标记,指示切割或装配的位置。由于这些标记会随时间自然消失,它们不会像永久性标记那样成为最终产品的残留物。 2. 设计草图:建筑师或设计师可能...
在JavaScript(JS)开发中,异步上传是处理大文件或需要实时反馈的上传操作时不可或缺的技术。异步上传能够避免用户等待整个文件上传完成,提高用户体验。它通常结合Ajax或者Fetch API来实现,允许在后台线程中进行...
不仅要确保印墨能在高温环境下保持稳定,不因灯泡工作而褪色或损坏,还要确保其对电子信号的透明性,以便于读取和识别。此外,印墨可能还需要具有环保属性,符合可持续发展的要求。 电子政务的实施,依赖于各种信息...
【标题】"外国个性特效PPT 褪色电影效果" 涉及的主要知识点是PPT设计与动画特效的应用,特别是将电影风格融入到PPT中的艺术处理手法。这样的设计通常能为演示文稿增添视觉吸引力,提高观众的关注度,并帮助传达主题...
为了代码复用和管理,可以封装成一个独立的JS组件或库,通过参数调用来创建各种类型的提示框。 总结来说,自定义提示框是JavaScript开发中的一个重要技能,它结合了HTML结构、CSS样式和JavaScript逻辑,能够实现...
文件中包含的功能列表: *createEl 动态...借鉴prototype.js * *说明:这个文件里具有的功能,大部分是从互联网上摘取出来后经 *过修改后形成. *另:在firefox2.0 和 IE 6中测试成功.没有添加错误控制机制.
易褪色、破损或需要特殊处理的衣物会被单独挑出,同时检查口袋是否有客人遗落的物品,确保安全。 2. 洗衣和烫衣程序 - **冲刷**:此步骤用于初步清除衣物表面的污渍,冷水能稀释污垢,便于后续清洗。 - **洗涤**...
《褪色的人生》观后感精选参考.doc
在本压缩包“行业文档-设计装置-服装用双头褪色笔.zip”中,主要包含了一份关于服装设计中使用的工具——服装用双头褪色笔的详细文档,即“服装用双头褪色笔.pdf”。这篇文档深入探讨了这种特殊设计装置在服装行业的...
这篇文档主要介绍了神奇褪色墨水的配制方法及其在会计学中的应用,结合了化学原理和实验设计,探讨了不同因素对褪色效果的影响。首先,问题的提出基于两个专利,选择了氢氧化钠和百里香酚酞的反应来配制褪色墨水,...