Asp.Net’ de hover buton yapmak

Enes Pekkaya    Asp.Net     Asp.Net

Asp.Net’ de hover image button yapmak istersek 2 tane yolumuz bulunmaktadır. Bunlardan ilki javascript yardımıyla yapmak.

Aşağıdaki kodda olduğu gibi sadece asp image butonuna “onmouseover” ve “onmouseout” javascript metodlarını ekleyerek istediğimiz butonlara hover efekti ekleyebiliriz.

2. yöntemimiz ise kendimize ait .net butonu oluşturmaktır. Aşağıdaki class yardımıyla asp.net image butonuna “HoverImageUrl” adlı değişken ekleyerek mouse butonun üzerine geldiğinde gelmesini istediğimiz resimi getirecektir.

using System;
using System.ComponentModel;
using System.Web.UI.WebControls;

namespace ImageButtonHover
{
public class ExtendedImageButton : ImageButton
{
[Browsable(true)]
public virtual string HoverImageUrl
{
get
{
object obj2 = this.ViewState["HoverImageUrl"];

if (obj2 != null && !string.IsNullOrEmpty(obj2.ToString()))
{
return (string)obj2;
}
return String.Empty;
}
set
{
this.ViewState["HoverImageUrl"] = value;

this.Attributes["onmouseover"] = "this.src='" + ResolveUrl(this.HoverImageUrl) + "';";
this.Attributes["onmouseout"] = "this.src='" + ResolveUrl(this.ImageUrl) + "';";
}
}
}
}

Hangi yöntem kolayınıza gidiyorsa istediğinizi kullanabilirsiniz.

Kendi yaptığım .net image butonu ile ilgili örnek kütüphane ve projeyi indirmek için tıklayın