|
code
newsgroups
|
|||||||||||||||||||||||
|
|||||||||||||||||||||||
Image Rollovers with the Hyperlink ControlI have several System.Web.UI.WebControls.HyperLink Controls which I want to
display as rollover images. I know how to make these manually using the <a> and <img> tags or the <a> tag and a System.Web.UI.WebControls.Image Control or a HyperLink and Image Controls, but the onMouseOver and onMouseOut attributes must be in the <img> tag. If I were to use the HyperLink's ImageUrl property and add the attributes using the HyperLink.Attributes.Add() method, I am assuming the attributes will appear in the generated <a> tag. Is there a way to create a Hyperlink Rollover without creating two Controls? Thanks. Hi Nathan,
Yes. You need not create two controls. In HyperLink you have a property called ImageUrl. Use this property to assign the image location. Cheers, Kris You seem to have misunderstood my problem. I know how to assign an image to
a HyperLink, but I need to make that image a rollover, and I want to use only one Control. Show quoteHide quote "Kris" <krishna.bi***@gmail.com> wrote in message news:1140249734.066827.193150@z14g2000cwz.googlegroups.com... > Hi Nathan, > > Yes. You need not create two controls. > > In HyperLink you have a property called ImageUrl. Use this property to > assign the image location. > > Cheers, > Kris > Hi,
I usually use the 2 controls. I try and make the image have a transparent background. That way when the mouse passes over the hyperlink the color changes and I dont have to change the image. The new asp.net 2.0 menu control does a lot of what you are looking for but I dont know if it work in your application. Ken ----------------- Ken ----------------------- Show quoteHide quote "Nathan Sokalski" <njsokal***@hotmail.com> wrote in message news:uf$MvqCNGHA.3196@TK2MSFTNGP09.phx.gbl... >I have several System.Web.UI.WebControls.HyperLink Controls which I want to >display as rollover images. I know how to make these manually using the <a> >and <img> tags or the <a> tag and a System.Web.UI.WebControls.Image Control >or a HyperLink and Image Controls, but the onMouseOver and onMouseOut >attributes must be in the <img> tag. If I were to use the HyperLink's >ImageUrl property and add the attributes using the >HyperLink.Attributes.Add() method, I am assuming the attributes will appear >in the generated <a> tag. Is there a way to create a Hyperlink Rollover >without creating two Controls? Thanks. > -- > Nathan Sokalski > njsokal***@hotmail.com > http://www.nathansokalski.com/ > Nathan i remember i posted something similar too as i had to fix it up for a
client and you made some sugesstions. What i did was supposeing you have an hyperlink and and image control like below in a repaeater etc.. <asp:Image id="Image1" runat="server" name="Image1" ImageUrl="images/off.gif"></asp:Image> <asp:HyperLink Tooltip='<%# DataBinder.Eval(Container.DataItem, "sample") %>' Cssclass="txtmenu" id="HyperLink1" runat="server" /> You can add the image on mouseover by adding this in your ItemDataBound like below If e.Item.ItemType = ListItemType.Item OrElse e.Item.ItemType = ListItemType.AlternatingItem Then Dim hyperLink As HyperLink = CType(e.Item.FindControl("HyperLink1"), HyperLink) Dim Image As System.Web.UI.WebControls.Image = CType(e.Item.FindControl("Image1"), System.Web.UI.WebControls.Image) hyperLink.Attributes.Add("onMouseOver", Image.ClientID & ".src='images/on.gif;return true;") hyperLink.Attributes.Add("onMouseOut", Image.ClientID & ".src='images/off.gif'; return true;") End If And that did the trick.. Hope that helps ** If you need more info let me know. Patrick Show quoteHide quote "Nathan Sokalski" <njsokal***@hotmail.com> wrote in message news:uf$MvqCNGHA.3196@TK2MSFTNGP09.phx.gbl... >I have several System.Web.UI.WebControls.HyperLink Controls which I want to >display as rollover images. I know how to make these manually using the <a> >and <img> tags or the <a> tag and a System.Web.UI.WebControls.Image Control >or a HyperLink and Image Controls, but the onMouseOver and onMouseOut >attributes must be in the <img> tag. If I were to use the HyperLink's >ImageUrl property and add the attributes using the >HyperLink.Attributes.Add() method, I am assuming the attributes will appear >in the generated <a> tag. Is there a way to create a Hyperlink Rollover >without creating two Controls? Thanks. > -- > Nathan Sokalski > njsokal***@hotmail.com > http://www.nathansokalski.com/ > Ever thought about making a custom control? I know I made one to make
a link button with an image, inheriting from the link button class. It wouldn't be too hard to do that with the hyperlink class and just have properties linkimage and hoverimage. then you create a javascript to swap the images. In your control you could then check if the script has been registered, if not register it with the page. This way you can use the same script with as many controls as you want. This can help encapsulate your code a little better and maybe make your life a bit easier :) HTH, Darren Kopp http://blog.secudocs.com I have thought about that, and someday I probably will, but right now I do
not have enough experience with making custom controls Design View friendly that I want to do that with this. I have written custom controls in the past, but am still studying and learning how to make their properties visible in the places I want (such as the properties palette). Almost everything I know about ASP.NET has been either self-taught from books/websites or learned from people in newsgroups, none of the universities I have attended seem to be big on .NET (if at all) yet. Show quoteHide quote "Darren Kopp" <darrenk***@gmail.com> wrote in message news:1140279788.539729.26850@o13g2000cwo.googlegroups.com... > Ever thought about making a custom control? I know I made one to make > a link button with an image, inheriting from the link button class. It > wouldn't be too hard to do that with the hyperlink class and just have > properties linkimage and hoverimage. then you create a javascript to > swap the images. In your control you could then check if the script > has been registered, if not register it with the page. This way you > can use the same script with as many controls as you want. > > This can help encapsulate your code a little better and maybe make your > life a bit easier :) > > HTH, > Darren Kopp > http://blog.secudocs.com > The code you give adds the onMouseOver and onMouseOut to the <a> tag, not
the <img> tag. Because of this, the rollover does not work. Show quoteHide quote "Patrick.O.Ige" <naijaco***@hotmail.com> wrote in message news:%23vh3l9JNGHA.3284@TK2MSFTNGP14.phx.gbl... > Nathan i remember i posted something similar too as i had to fix it up for > a client and you made some sugesstions. > What i did was supposeing you have an hyperlink and and image control > like below in a repaeater etc.. > > <asp:Image id="Image1" runat="server" name="Image1" > ImageUrl="images/off.gif"></asp:Image> > <asp:HyperLink Tooltip='<%# > DataBinder.Eval(Container.DataItem, "sample") %>' > Cssclass="txtmenu" id="HyperLink1" runat="server" /> > > You can add the image on mouseover by adding this in your ItemDataBound > like below > > If e.Item.ItemType = ListItemType.Item OrElse e.Item.ItemType = > ListItemType.AlternatingItem Then > Dim hyperLink As HyperLink = > CType(e.Item.FindControl("HyperLink1"), HyperLink) > Dim Image As System.Web.UI.WebControls.Image = > CType(e.Item.FindControl("Image1"), System.Web.UI.WebControls.Image) > > hyperLink.Attributes.Add("onMouseOver", Image.ClientID & > ".src='images/on.gif;return true;") > hyperLink.Attributes.Add("onMouseOut", Image.ClientID & > ".src='images/off.gif'; return true;") > > End If > > And that did the trick.. > Hope that helps > ** If you need more info let me know. > Patrick > > "Nathan Sokalski" <njsokal***@hotmail.com> wrote in message > news:uf$MvqCNGHA.3196@TK2MSFTNGP09.phx.gbl... >>I have several System.Web.UI.WebControls.HyperLink Controls which I want >>to display as rollover images. I know how to make these manually using the >><a> and <img> tags or the <a> tag and a System.Web.UI.WebControls.Image >>Control or a HyperLink and Image Controls, but the onMouseOver and >>onMouseOut attributes must be in the <img> tag. If I were to use the >>HyperLink's ImageUrl property and add the attributes using the >>HyperLink.Attributes.Add() method, I am assuming the attributes will >>appear in the generated <a> tag. Is there a way to create a Hyperlink >>Rollover without creating two Controls? Thanks. >> -- >> Nathan Sokalski >> njsokal***@hotmail.com >> http://www.nathansokalski.com/ >> > > Nathan if you are interested in the img
Try loooking at :- http://aspnet.4guysfromrolla.com/articles/091703-1.aspx or http://aspalliance.com/317 Hope that helps Patrick Show quoteHide quote "Nathan Sokalski" <njsokal***@hotmail.com> wrote in message news:Oi7sUrLNGHA.3064@TK2MSFTNGP10.phx.gbl... > The code you give adds the onMouseOver and onMouseOut to the <a> tag, not > the <img> tag. Because of this, the rollover does not work. > -- > Nathan Sokalski > njsokal***@hotmail.com > http://www.nathansokalski.com/ > > "Patrick.O.Ige" <naijaco***@hotmail.com> wrote in message > news:%23vh3l9JNGHA.3284@TK2MSFTNGP14.phx.gbl... >> Nathan i remember i posted something similar too as i had to fix it up >> for a client and you made some sugesstions. >> What i did was supposeing you have an hyperlink and and image control >> like below in a repaeater etc.. >> >> <asp:Image id="Image1" runat="server" name="Image1" >> ImageUrl="images/off.gif"></asp:Image> >> <asp:HyperLink Tooltip='<%# >> DataBinder.Eval(Container.DataItem, "sample") %>' >> Cssclass="txtmenu" id="HyperLink1" runat="server" /> >> >> You can add the image on mouseover by adding this in your ItemDataBound >> like below >> >> If e.Item.ItemType = ListItemType.Item OrElse e.Item.ItemType = >> ListItemType.AlternatingItem Then >> Dim hyperLink As HyperLink = >> CType(e.Item.FindControl("HyperLink1"), HyperLink) >> Dim Image As System.Web.UI.WebControls.Image = >> CType(e.Item.FindControl("Image1"), System.Web.UI.WebControls.Image) >> >> hyperLink.Attributes.Add("onMouseOver", Image.ClientID & >> ".src='images/on.gif;return true;") >> hyperLink.Attributes.Add("onMouseOut", Image.ClientID & >> ".src='images/off.gif'; return true;") >> >> End If >> >> And that did the trick.. >> Hope that helps >> ** If you need more info let me know. >> Patrick >> >> "Nathan Sokalski" <njsokal***@hotmail.com> wrote in message >> news:uf$MvqCNGHA.3196@TK2MSFTNGP09.phx.gbl... >>>I have several System.Web.UI.WebControls.HyperLink Controls which I want >>>to display as rollover images. I know how to make these manually using >>>the <a> and <img> tags or the <a> tag and a >>>System.Web.UI.WebControls.Image Control or a HyperLink and Image >>>Controls, but the onMouseOver and onMouseOut attributes must be in the >>><img> tag. If I were to use the HyperLink's ImageUrl property and add the >>>attributes using the HyperLink.Attributes.Add() method, I am assuming the >>>attributes will appear in the generated <a> tag. Is there a way to create >>>a Hyperlink Rollover without creating two Controls? Thanks. >>> -- >>> Nathan Sokalski >>> njsokal***@hotmail.com >>> http://www.nathansokalski.com/ >>> >> >> > > 
Other interesting topics
Classic ASP String Manipulation - NOT .net
Server Side Custom Validation not running Programatically Databinding controls within a Repeater DataGrid Conditional Formatting MaxLenth doesn't work Master Pages session variables Populate dropdown/listbox My WebControls stopped working GridView ASP.NET 2.0 Question Passing Values into Formview or DetailsView |
|||||||||||||||||||||||
