CODEWITHSUNDEEP
htmlcss
Dónal
Dónal

Reputation: 187399

clickable/hoverable element on webpage

When the user clicks on (or moves their mouse over) my tables' column headers, I will use JavaScript to popup a lengthier description of the data in that column.

However, in order to entice the user to move the mouse over (or click on) the column headers, I need to make them "look clickable". I think I've seen this done before using a HTML link that doesn't actually link anywhere, something like

<a href="#">Age</a>

From a semantic markup point of view this seems like a bad approach, because the element isn't actually a link, I just want to make it look like a link, so that the user knows something will happen when they click on it.

Is there a better approach?

Thanks, Don

Upvotes: 0

Views: 126

Answers (1)

Jacob Mattison
Jacob Mattison

Reputation: 51062

One option is to use the CSS "cursor" property to make the cursor turn into the "hand" pointer that is typically used for links:

.myHeaderClass{
    cursor: pointer;
}

If your page applies special styling to links (e.g. a different color) you could also do the same for these headers, of course.

Upvotes: 2

Related Questions