`
whitesmith
  • 浏览: 16800 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

GRIDVIEW鼠标移动行变色

 
阅读更多
方法一:  

在GridView的  

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)  
{  
if (e.Row.RowType == DataControlRowType.DataRow)  
{  
            e.Row.Attributes.Add("onMouseOver", "SetNewColor(this);");  
            e.Row.Attributes.Add("onMouseOut", "SetOldColor(this);");  
        }
    }

在页面中加入  

<SCRIPT language=javascript>
       var _oldColor;  
       function SetNewColor(source)  
{  
          _oldColor=source.style.backgroundColor;  
          source.style.backgroundColor='#666666';  

       }
       function SetOldColor(source)  
{  
         source.style.backgroundColor=_oldColor;  
       }
</SCRIPT>



方法二:  

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)  
{  
if (e.Row.RowType == DataControlRowType.DataRow)  
{  
            e.Row.Attributes["onMouseOver"] = "js.ItemOver(this)";  
        }
    }

在页面上加入  

<SCRIPT language=javascript type=text/javascript>
    var js=new function(){  
if (!objbeforeItem){var objbeforeItem=null;var objbeforeItembackgroundColor=null;}
this.ItemOver=function(obj)  
{  
if(objbeforeItem){objbeforeItem.style.backgroundColor = objbeforeItembackgroundColor;}
        objbeforeItembackgroundColor = obj.style.backgroundColor;  
        objbeforeItem = obj;  
        obj.style.backgroundColor = "#fcfcfc";       
    }

}
</SCRIPT>

方法三:  

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)  
{  
if (e.Row.RowType == DataControlRowType.DataRow)  
{  
//鼠标移动到每项时颜色交替效果  
         e.Row.Attributes.Add("OnMouseOut", "this.style.backgroundColor='White';this.style.color='#003399'");  
         e.Row.Attributes.Add("OnMouseOver", "this.style.backgroundColor='#6699FF';this.style.color='#8C4510'");  

//设置悬浮鼠标指针形状为"小手"  
         e.Row.Attributes["style"] = "Cursor:hand";  
        }
    }


//----------------------------------------

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)  
{  
if (e.Row.RowType == DataControlRowType.DataRow) //判断是否是DataRow,以防止鼠标经过Header也有效果  
{  
            e.Row.Attributes.Add("onmouseover", "e=this.style.backgroundColor; this.style.backgroundColor='#cccccc'");  
            e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=e");  
        }
    }

分享到:
评论

相关推荐

    gridview选中变色实现方法,.net

    - `onmouseover`:当鼠标移动到行上时触发的动作。 - `c=this.style.backgroundColor`:保存当前元素的背景颜色到变量`c`中。 - `this.style.backgroundColor='#37B4F5'`:设置背景颜色为`#37B4F5`。 - `this....

    asp.net鼠标移动到GridView某一行时该行背景变色

    asp.net,GridView控件中鼠标移动到GridView某一行时该行背景色发生变化。

    重写GridView,鼠标移动各行数据颜色改变

    "重写GridView"意味着我们需要自定义GridView的行为,以实现特定的功能,例如在鼠标移动时改变行的颜色。 要实现“鼠标移动过程中,使GridView中的数据行不停变更颜色”的效果,我们首先需要了解几个关键的概念: ...

    asp.net GridView控件鼠标移动某行改变背景颜色(方法一)

    本知识点介绍如何利用GridView控件实现鼠标移动到某一行时改变该行的背景颜色,具体是通过注册GridView的RowDataBound事件来实现的。 首先,当页面加载时,需要将数据源绑定到GridView控件上。这是通过调用`Bind...

    asp.net Gridview数据列中实现鼠标悬浮变色

    通过上述步骤,当用户在GridView的任何一行上移动鼠标时,该行的背景色会立即变为指定的颜色,从而提供一种视觉反馈,增强用户体验。同时,当用户点击某行时,还可以通过`onclick`事件模拟复选框的选中效果。 总结...

    asp.net下让Gridview鼠标滑过光棒变色效果

    标题和描述提到的“asp.net下让Gridview鼠标滑过光棒变色效果”正是这样一个功能,下面将详细解释如何实现这个效果。 首先,我们需要了解GridView的基本结构。GridView是一个用于显示数据集合的Web控件,它可以绑定...

    非常简单易用的girdview鼠标移动或点击的行背景色事件

    在本案例中,我们将讨论如何实现一个非常简单易用的功能,即当鼠标移动到GridView的某一行或者用户点击某一行时,该行的背景色发生变化。这个功能可以提升用户的交互体验,使用户更易于区分当前选中的行。 首先,`...

    Asp.net GridView隔行变色和光棒效果2种方法实现

    这段代码会在鼠标移动到某行时改变背景颜色,鼠标离开时恢复原色。 方法二:JQuery方式 这种方法完全依赖于客户端JavaScript库jQuery。首先,需要在页面中引入jQuery库,并定义CSS样式来区分不同状态的行: ```...

    为GridView的行添加鼠标经过、点击事件的小例子

    `onmouseover` 事件使得当鼠标移动到行上时,背景颜色变为`#95B8FF`,`onmouseout`事件则在鼠标离开行时恢复原来的背景颜色。这通过JavaScript中的DOM元素样式修改实现: ```csharp e.Row.Attributes.Add(...

    asp.net GridView和DataList实现鼠标移到行行变色

    这样,当鼠标移动到行上时,行的颜色就会改变,当鼠标离开时,行的颜色又会恢复原状。 下面是具体的代码示例: ```csharp protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e) { if ...

    一个简单但常用的javascript表格样式_鼠标划过行变色 简洁实现

    鼠标悬停行变色是一种交互效果,当用户将鼠标指针移动到表格的某一行时,该行的颜色会发生变化。这种方法同样可以帮助用户在视觉上区分表格的不同行,尤其是在查看大量数据时。 ### 简洁实现方法 在文档中提到的...

    在线考试系统网站源码

    GridView鼠标移动行就变色;GridView列字数过多时省略后面的字;删除时弹出是否确定对 话框;GridView模板中获取用户的输入;多条件搜索的查询;权限管理。 四、注意事项 1、后台管理员用户名密码均是:admin,教师...

    修改grid行或列颜色

    ### 一、ExtJS GridView配置详解 在ExtJS中,`gridviewConfig` 是一个非常重要的配置对象,它用于定义Grid视图的行为。在给定的例子中,我们重点关注 `getRowClass` 方法和 CSS 样式定义。 #### 1.1 `getRowClass`...

    在线考试系统源码(VS2005+SQL2000)

    GridView鼠标移动行就变色;GridView列字数过多时省略后面的字;删除时弹出是否确定对话框;GridView模板中获取用户的输入;多条件搜索的查询;权限管理。。。。。希望对初学.NET的朋友有帮助。 7、因为实习完了,...

    多功能在线考试系统改进版源码

    GridView鼠标移动行就变色;GridView列字数过多时省略后面的字;删除时弹出是否确定对话框;GridView模板中获取用户的输入;多条件搜索的查询;权限管理。。。。。希望对初学.NET的朋友有帮助 后台模块包括: 个人...

    功能比较全面的考试系统(VS2005+SQL2000)

    GridView鼠标移动行就变色;GridView列字数过多时省略后面的字;删除时弹出是否确定对话框;GridView模板中获取用户的输入;多条件搜索的查询;权限管理。。。。。希望对初学.NET的朋友有帮助。 7、因为实习完了,...

    多功能在线考试系统改进版源码(毕业设计c#)

    GridView鼠标移动行就变色;GridView列字数过多时省略后面的字;删除时弹出是否确定对话框;GridView模板中获取用户的输入;多条件搜索的查询;权限管理。。。。。希望对初学.NET的朋友有帮助。 后台模块包括: ...

    《程序天下:JavaScript实例自学手册》光盘源码

    10.11 选中表格行前的复选框则行变色 10.12 用JavaScript生成面包屑导航 10.13 复选框的反选 10.14 选中所有复选框 10.15 复选框全选(二) 10.16 改变slsect选中项的颜色特效 第11章 颜色处理和菜单特效 11.1 背景...

Global site tag (gtag.js) - Google Analytics