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_RowCreated(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow )
{
e.Row.Attributes.Add("onmouseover", "currentcolor=this.style.backgroundColor;this.style.backgroundColor='#C0C0FF';this.style.cursor='hand';");
//当鼠标移走时还原该行的背景色
e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=currentcolor");
}
}
GridView鼠标悬停弹出层：
ToolTip.aspx <%@ Page Language="C#" AutoEventWireup="true" CodeFile="ToolTip.aspx.cs" Inherits="ToolTip" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>ToolTip</title> </head> <mce:script language="javascript"><!-- function Show(qusetion, answer, email) { document.getElementById("td1").innerText="问题：" + qusetion; document.getElementById("td2").innerText="答案：" + answer; document.getElementById("td3").innerText="邮箱：" + email; x = event.clientX + document.body.scrollLeft; y = event.clientY + document.body.scrollTop + 30; div1.style.display="block"; div1.style.left = x; div1.style.top = y; } function Hide() { div1.style.display="none"; } // --></mce:script> <body> <form id="form1" runat="server"> <div id="div1" style="display:none; position:absolute" mce_style="display:none; position:absolute"> <table border="0" cellpadding="0" bgcolor="#6699ff"> <tr> <td width="180px" style="color:White" mce_style="color:White">信息<hr /></td> </tr> <tr> <td id="td1" height="25px" style="color:White" mce_style="color:White"></td> </tr> <tr> <td id="td2" height="25px" style="color:White" mce_style="color:White"></td> </tr> <tr> <td id="td3" height="25px" style="color:White" mce_style="color:White"></td> </tr> </table> </div> <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" Font-Size="11pt" OnRowDataBound="GridView1_RowDataBound"> <Columns> <asp:TemplateField HeaderText="用户ID" InsertVisible="False" SortExpression="ID"> <ItemTemplate> <asp:Label ID="Label1" runat="server" Text='<%# Bind("ID") %>'></asp:Label> </ItemTemplate> <HeaderStyle BackColor="Blue" ForeColor="White" /> </asp:TemplateField> <asp:TemplateField HeaderText="用户名" SortExpression="Uname"> <ItemTemplate> <asp:Label ID="Label2" runat="server" Text='<%# Bind("Uname") %>'></asp:Label> </ItemTemplate> <HeaderStyle BackColor="Blue" ForeColor="White" /> </asp:TemplateField> </Columns> </asp:GridView> </form> </body> </html> ToolTip.aspx.cs using System; using System.Data; using System.Configuration; using System.Collections; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Web.UI.HtmlControls; using System.Data.SqlClient; public partial class ToolTip : System.Web.UI.Page { private DataTable dt; protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { string sql = "SELECT * FROM [Utest]"; DataSet ds = SqlHelper.ExecuteDataset(SqlHelper.CONN_STRING, CommandType.Text, sql); dt = new DataTable(); dt = ds.Tables[0]; GridView1.DataSource = dt; GridView1.DataBind(); } } protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e) { if (e.Row.RowType == DataControlRowType.DataRow) { Label lab = e.Row.FindControl("Label2") as Label; lab.Attributes.Add("onmousemove", "Show('" + dt.Rows[e.Row.RowIndex]["Uquestion"].ToString() + "', '" + dt.Rows[e.Row.RowIndex]["Uanswer"].ToString() + "', '" + dt.Rows[e.Row.RowIndex]["Uemail"].ToString() + "')"); lab.Attributes.Add("onmouseout", "Hide();"); } } }