[英]Simple rollover image in c#
我正在嘗試將懸停圖像添加到我正在處理的DotNetNuke測試頁面中,但似乎語法不正確(對C#來說是全新的)。 我敢肯定,對於任何有經驗的人來說,這應該是一個簡單的方法。
到目前為止,我已經嘗試了幾種不同的方法,其中大多數方法都會導致對象引用錯誤。 這是我嘗試過的最后一件事(請注意,在下面的代碼中,我將該行放置在此處,因為這是添加其他屬性的地方,我想這里有一個更合乎邏輯的位置?):
loginLink.Attributes.Add(" onmouseover", "this.src=(http://localhost/portals/_default/skins/BSAVA/Images/Nav/log_in_link_h.png);");
頁面加載沒有錯誤,但是過渡不起作用。 鏈接使用以下屬性呈現:
onmouseover="this.src=(http://localhost/portals/_default/skins/BSAVA/Images/Nav/log_in_link_h.png);"
顯然不正確。
整個頁面代碼如下:
using System;
using System.Web;
using System.Web.UI;
using DotNetNuke.Common;
using DotNetNuke.Common.Utilities;
using DotNetNuke.Services.Exceptions;
using DotNetNuke.Services.Localization;
using DotNetNuke.UI.Modules;
namespace DotNetNuke.UI.Skins.Controls
{
public partial class Login : SkinObjectBase
{
private const string MyFileName = "Login.ascx";
public string Text { get; set; }
public string CssClass { get; set; }
public string LogoffText { get; set; }
public string login_link_img = "http://localhost/portals/_default/skins/BSAVA/Images/Nav/log_in_link.png";
public string login_link_img_hover = "http://localhost/portals/_default/skins/BSAVA/Images/Nav/log_in_link_h.png";
public string logout_link_img_hover = "http://localhost/portals/_default/skins/BSAVA/Images/Nav/logout_link_h.png";
public string logout_link_img = "http://localhost/portals/_default/skins/BSAVA/Images/Nav/logout_link.png";
protected override void OnLoad(EventArgs e)
{
base.OnLoad(e);
try
{
if (Request.IsAuthenticated)
{
loginLink.CssClass = "logoutLink";
loginLink.ImageUrl = logout_link_img;
if (!String.IsNullOrEmpty(LogoffText))
{
if (LogoffText.IndexOf("src=") != -1)
{
LogoffText = LogoffText.Replace("src=\"", "src=\"" + PortalSettings.ActiveTab.SkinPath);
}
loginLink.Text = LogoffText;
}
else
{
loginLink.Text = Localization.GetString("Logout", Localization.GetResourceFile(this, MyFileName));
}
loginLink.NavigateUrl = Globals.NavigateURL(PortalSettings.ActiveTab.TabID, "Logoff");
}
else
{
loginLink.CssClass = "loginLink";
loginLink.ImageUrl = login_link_img;
if (!String.IsNullOrEmpty(Text))
{
if (Text.IndexOf("src=") != -1)
{
Text = Text.Replace("src=\"", "src=\"" + PortalSettings.ActiveTab.SkinPath);
}
loginLink.Text = Text;
}
else
{
loginLink.Text = Localization.GetString("Login", Localization.GetResourceFile(this, MyFileName));
}
string returnUrl = HttpContext.Current.Request.RawUrl;
if (returnUrl.IndexOf("?returnurl=") != -1)
{
returnUrl = returnUrl.Substring(0, returnUrl.IndexOf("?returnurl="));
}
returnUrl = HttpUtility.UrlEncode(returnUrl);
loginLink.NavigateUrl = Globals.LoginURL(returnUrl, (Request.QueryString["override"] != null));
if (PortalSettings.EnablePopUps && PortalSettings.LoginTabId == Null.NullInteger)
{
loginLink.Attributes.Add(" onclick", "return " + UrlUtils.PopUpUrl(loginLink.NavigateUrl, this, PortalSettings, true, false, 200, 550));
loginLink.Attributes.Add(" onmouseover", "this.src=(http://localhost/portals/_default/skins/BSAVA/Images/Nav/log_in_link_h.png);");
}
}
}
catch (Exception exc)
{
Exceptions.ProcessModuleLoadException(this, exc);
}
}
}
}
我已經做了很多搜索,似乎有幾種方法不是使用JavaScript而是使用JavaScript。 非常感謝任何幫助,謝謝。
我使用此代碼在Image按鈕上實現RolloverImage效果:
namespace My.Controls
{
/// <summary>
/// Summary description for RolloverImageButton
/// </summary>
[DefaultProperty("Text")]
[ToolboxData("<{0}:RolloverImageButton runat=server></{0}:RolloverImageButton>")]
public class RolloverImageButton : ImageButton
{
[DefaultValue("")]
[UrlProperty]
[Bindable(true)]
public virtual string ImageOverUrl
{
get
{
if (null == ViewState["ImageOverUrl"]) return string.Empty;
else return Convert.ToString(ViewState["ImageOverUrl"]);
}
set { ViewState["ImageOverUrl"] = value; }
}
protected override void AddAttributesToRender(HtmlTextWriter writer)
{
writer.AddAttribute("onmouseover", "this.src='" + base.ResolveClientUrl(ImageOverUrl) + "'");
writer.AddAttribute("onmouseout", "this.src='" + base.ResolveClientUrl(ImageUrl) + "'");
base.AddAttributesToRender(writer);
}
}
}
您可以像在ImageButton中一樣在標記中使用它,但是也可以將ImageOverUrl設置為它。
要使控件全局可用而不在每個頁面中都包含名稱空間,您可以像這樣簡單地添加對web.config的引用:
<system.web>
...
<pages theme="..." controlRenderingCompatibilityVersion="..." clientIDMode="...">
<controls>
<add tagPrefix="mycontrols" namespace="My.Controls" />
</controls>
</pages>
</system.web>
然后,您可以使用標記中My.Control命名空間中定義的所有控件,如下所示:
<mycontrols:RolloverImageButton runat="server" ImageUrl="~/Images/image1.png" ImageOverUrl="~/Images/image1_h.png" ... />
如果您不希望它成為Button控件,則只需重寫Image類而不是ImageButton
類,並將其稱為RolloverImage
。 您應該擁有一個可以在普通HyperLink中顯示的圖像標簽。
此致傑拉爾德
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.