Sun Dial Menu
How to add a custom event to an element
Menu How to add a custom event to an element
 

How to add a custom event to an element

Adding events to elements such as buttons and text within "quote" boxes is a useful documentation technique.

Multiple Clickable text links

On my page about the murals in Belchamp Walter Church I have added multiple event handlers to link to images by Stiffleaf on the Ipernity website.

Top

Adding a hyperlink to an element

While this is quite cute, it results in a confusing situation as the visitor does not expect this.

A link should look like a link as that is what most users expect. Putting a hyperlink on a block of text, as in a quote, is confusing.

In any case the link to the external website is now dead and the example above is now a moot point.

The code to do this

The first thing is to select the element by id.

and then an Eventlistener is added to it.......

A script

script>
document.getElementById("ip1").addEventListener("click", function()
    { location.href = "stiffleaf_3.html" })
</script> !-- Gate of Jerusalem -->

Site design by Tempusfugit Web Design -