如何在CSS样式中利用expression实现JavaScript中的onmouseover/onmouseout事件
如何在CSS样式中利用expression实现javascript中的onmouseover/onmouseout事件
/*当鼠标移动到这里(比如表格里的一行)的时候背景色变化为黄色*/
onmouseover: expression(onmouseover=function (){this.style.backgroundColor ='yellow'});
/*当鼠标移动到这里的时候背景色还原为原来的颜色*/
onmouseout: expression(onmouseout=function (){this.style.backgroundColor =''});
下面的实例在CSS样式表里使用onmouseover/onmouseout事件;当移动到单元格的时候该单元格的背景色/边框/文字颜色将改变。根据需要可以加入其它的属性,实现一些简单的网页特效。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> CSS样式里使用javascript(onmouseover/onmouseout)2</TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style type="text/css">
table
{
background-color:#000000;
cursor:hand;
}
td
{
/*设置onmouseover事件*/
onmouseover: expression(onmouseover=function (){this.style.borderColor ='blue';this.style.color='red';this.style.backgroundColor ='yellow'});
/*设置onmouseout事件*/
onmouseout: expression(onmouseout=function (){this.style.borderColor='';this.style.color='';this.style.backgroundColor =''});
background-color:#ffffff;
}
</style>
</HEAD>
<BODY>
<TABLE cellspacing='1px' border='1'>
<TR>
<TD>风儿吹散了蒲公英...... </TD>
<TD>风儿吹散了蒲公英...... </TD>
<TD>风儿吹散了蒲公英...... </TD>
</TR>
<TR>
<TD>风儿吹散了蒲公英...... </TD>
<TD>风儿吹散了蒲公英...... </TD>
<TD>风儿吹散了蒲公英...... </TD>
</TR>
</TABLE>
</BODY>
</HTML>
相关连接：
1.CSS中expression使用简介
- 收藏此页到 IE收藏夹 POCO网摘 [365Key] [ViVi] 百度藏搜 和讯网摘 天极网摘 狐摘 向您的朋友推荐此文章
- 转载请注明来源：文章大全 网址：http://www.itlearner.com/article/
- 文章关键词：css expression onmouseover onmouseout
- 如意搜索搜索更多内容：如何在CSS样式中利用expression实现JavaScript中的onmouseover/onmouseout事件
- 特别声明： 本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载，但请务必注明出处和原始作者。文章版权归文章原始作者所有。对于被本站转载文章的个人和网站，我们表示深深的谢意。如果本站转载的文章有版权问题请联系我们，我们会尽快予以更正。
- 上一篇文章：2005互联网站品牌栏目和频道推荐名单揭晓
- 下一篇文章：CSS中expression使用简介