asked on

creating image rollovers by using asp:hyperlink and javascript instead of pure html and CSS

hi experts,

i wanted to create hyperlink buttons that is able to perform image rollovers whenever the cursor hovers on it, i know is very easy to create one but i'm a newbie on asp; i have gone thru a lot of tutorial and all solutions given is either pure html/javascript or asp:hyperlink with C# "code behind" or asp:hyperlink with vb "code behind" that is not even a complete set of code, i am very frustrated and wonder is it possible that pure html and asp version of html is any difference is pretty easy by using <img onmouseover...> but <asp:hyperlink> just doens't let me do so... is there any solution out there? i want to create a rollover button for hyperlink with the use of javascript and i want it in asp html version not pure html version. Make it simple and straightforward. thanks!

<HTML>
	<HEAD>
		<title>Dickson Lim Applied Knowledge Center</title>
		<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
		<meta content="Visual Basic .NET 7.1" name="CODE_LANGUAGE">
		<meta content="JavaScript" name="vs_defaultClientScript">
		<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
		<script type="text/javascript">
		function mouseOver()
		{
			document.mainButton.src = "images/topbutton2_main.gif";
		}
		function mouseOut()
		{
			document.mainButton.src = "images/topButton1_main.gif";
		}
		</script>
	</HEAD>
	<body style="BACKGROUND-IMAGE: url(images/DK_bg.gif)" bgProperties="fixed" MS_POSITIONING="GridLayout">
		<form id="Form1" method="post" runat="server">
			<asp:image id="Header" style="Z-INDEX: 103; LEFT: 256px; POSITION: absolute; TOP: 8px" runat="server"
				ImageUrl="images\DicksonLimHeader.gif" Width="740px" Height="140px"></asp:image>
			<asp:HyperLink id="MainLink" style="Z-INDEX: 105; LEFT: 264px; POSITION: absolute; TOP: 248px"
				runat="server">MAIN</asp:HyperLink>
			<asp:hyperlink id="QA" style="Z-INDEX: 101; LEFT: 264px; POSITION: absolute; TOP: 296px" runat="server"
				NavigateUrl="http://localhost/DicksonLim/DicksonQA.aspx">Q&A</asp:hyperlink>
			<asp:hyperlink id="HyperLink3" style="Z-INDEX: 102; LEFT: 264px; POSITION: absolute; TOP: 344px"
				runat="server">Useful Links</asp:hyperlink>
			<asp:ImageButton id="mainButton" style="Z-INDEX: 104; LEFT: 256px; POSITION: absolute; TOP: 152px"
				runat="server" ImageUrl="images\topbutton1_main.gif"></asp:ImageButton>
			
		</form>
	</body>
</HTML>

Open in new window

mr_egyptian

Per usual, asp looks like a big pain to me, but this seems to be what your after:

http://aspalliance.com/317

zerovector

ASKER

this doesn't help as it declare image and hyperlink seperartely whereas i declare it all thogether inside the asp:hyperlink, and i just don't understand why it uses this:

Image1.Attributes.Add("name", Image1.ClientID)
Link1.NavigateUrl = "#"

why needs clientID and what "#" means?

ASKER CERTIFIED SOLUTION

Snarf0001

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial