MouseOver (asp.net + javascript) problem???
---------------------
Custom button class
---------------------
[HTML]
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
namespace CustomServerControlsLibrary
{
public class RollOverButton : WebControl, IPostBackEventHandler
{
public RollOverButton() : base(HtmlTextWriterTag.Img)
{
ImageUrl = "";
MouseOverImageUrl = "";
}
public string ImageUrl
{
get {return (string)ViewState["ImageUrl"];}
set {ViewState["ImageUrl"] = value;}
}
public string MouseOverImageUrl
{
get {return (string)ViewState["MouseOverImageUrl"];}
set {ViewState["MouseOverImageUrl"] = value;}
}
protected override void AddAttributesToRender(HtmlTextWriter output)
{
output.AddAttribute("name", ClientID);
output.AddAttribute("src", ImageUrl);
output.AddAttribute("onClick", Page.ClientScript.GetPostBackEventReference(new PostBackOptions(this)));
output.AddAttribute("onMouseOver",
"swapImg('" + this.ClientID + "', '" +
MouseOverImageUrl + "');");
output.AddAttribute("onMouseOut",
"swapImg('" + this.ClientID + "', '" +
ImageUrl + "');");
}
protected override void OnPreRender(EventArgs e)
{
if (!Page.ClientScript.IsClientScriptBlockRegistered("swapImg"))
{
string script =
"<script language='JavaScript'> " +
"function swapImg(id, url) { " +
"elm = document.getElementById(id); " +
"if(elm) elm.src=url; }" +
"</script> ";
Page.ClientScript.RegisterClientScriptBlock(this.GetType(),
"swapImg", script);
}
base.OnPreRender (e);
}
public event EventHandler ImageClicked;
public void RaisePostBackEvent(string eventArgument)
{
OnImageClicked(new EventArgs());
}
protected virtual void OnImageClicked(EventArgs e)
{
// Check for at least one listener and then raise the event.
if (ImageClicked != null)
ImageClicked(this, e);
}
}
}
[/HTML]
--------------------------------------
Using of custom buttons on asp.net page
--------------------------------------
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="RolloverTest.aspx.cs" Inherits="RolloverTest" %>
<%@ Register Assembly="JavaScriptCustomControls" Namespace="CustomServerControlsLibrary"
TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<cc1:RollOverButton id="RollOverButton1" style="Z-INDEX: 100; LEFT: 22px; POSITION: absolute; TOP: 22px"
runat="server" Width="134px" Height="36px" MouseOverImageUrl="buttonMouseOver.jpg" ImageUrl="buttonOriginal.jpg" onImageClicked="RollOverButton1_ImageClicked"></cc1:RollOverButton>
<br />
<br />
<cc1:RollOverButton id="RollOverButton2" style="Z-INDEX: 101; LEFT: 21px; POSITION: absolute; TOP: 63px"
runat="server" Width="134px" Height="36px" MouseOverImageUrl="buttonMouseOver.jpg" ImageUrl="buttonOriginal.jpg" onImageClicked="RollOverButton1_ImageClicked"></cc1:RollOverButton>
</div>
</form>
</body>
</html>
---------------------
RolloverTest.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;
public partial class RolloverTest : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void RollOverButton1_ImageClicked(object sender, EventArgs e)
{
Response.Write("Button clicked.");
}
}