Q&A
-
Is there some way to customize the appearance of hyperlinks in a Web form as you might in a standard Web page?
-
You can customize the appearance of hyperlinks in a Web form by setting that form's
link(the color of a hyperlink before it has been clicked),alink(the color of a hyperlink as it has being clicked), andvlink(the color of a hyperlink the user has already visited) properties in the Properties window.
- Can I add code to change a hyperlink's color when the mouse moves over it as you see in many pages on the Web?
- Yes, you can by adding JavaScript to handle the hyperlink's
OnMouseOverandOnMouseOutevents. You can't do that by addingonmouseoverandonmouseoutJavaScript attributes directly to the<asp:HyperLink>element in the .aspx file because<asp:HyperLink>creates a Web server control and Visual Basic will complain if you try to modify it. But you can attach JavaScript to handle these events usingforandeventHTML attributes in a<script>element in the Web form's<head>section. Theforattribute, which is crucial here, is supported only in Internet Explorer; using this attribute, you can specify which HTML element a script is for, and that lets you use JavaScript to handle events for any HTML element, even Web server controls. For example, to make the text inHyperLink1change to red when the mouse is over the link and back to blue (the default color for links in Web forms) when the mouse moves on, you can add this HTML and JavaScript to a Web form's<head>element in the .aspx file:
<head>
.
.
.
<style>
.red {color:red}
.blue {color:blue}
</style>
<script for = "HyperLink1" event = "onmouseover">
HyperLink1.className = "red"
</script>
<script for = "HyperLink1" event = "onmouseout">
HyperLink1.className = "blue"
</script>
.
.
.
</head>
Workshop
This workshop tests whether you understand the concepts you saw today. It's a good idea to make sure that you can answer these questions before pressing on to tomorrow's work.
Quiz
-
What property do you use to store the text an image control should display if the image is unavailable?
-
What is the type of the object passed to you in an image button's
Clickevent handler that contains the mouse location? -
What's the major event for a list box control—the one that lets you determine what item was most recently selected?
-
How do you make a drop-down list box support multiple selections?
-
What properties do you use to set a hyperlink control's text, URL, target, and image?
Quiz Answers
-
The
AlternateTextproperty. -
It's an
ImageClickEventArgsobject. You use theXandYproperties of this object to get the mouse position. -
The
SelectedIndexChangedevent, which occurs when the selected item is changed. To handle this event when it occurs, you need to set theAutoPostBackproperty toTrue. -
That's a trick question—you can't make a drop-down list box support multiple selections.
-
You use the
Text,NavigateUrl,Target, andImageUrlproperties.
Exercises
-
Create a new Web application with an image map that supports four hotspots and lets the user navigate to four of your favorite Web sites. If the user clicks the image map outside any hotspot, display a prompt in a label suggesting that the user try again.
-
When the user clicks a hyperlink with the text
"Select URL"as displayed using a link button, display a drop-down list box full of Web site names from which the user can select. Store the URL for each Web site in the corresponding list item'sValueproperty. After the user has made her selection, recover that URL from theSelectedValueproperty and navigate to it.
Comments