Leveraging JS for the first time

Hi
This might be a good topic for a how to guide to help those looking to explore the extra functionality available with javascript / JQuery ( I mention both to help people find this in search)

I have a need to show certain images depending which button a user presses or ultimately which H1 title they hover over. So i started experimenting with codepen.io and using

Show Image

and JS of

function show() {
document.getElementById(‘image’)
.style.display = “block”;

I can display the image with a click . Very simple i know but its always best to start simple when learning. Now if i add this as a RAW element into Cornerstone and add the JS to the Global JS area it works as expected but i would like to learn how to leverage the JS while using the in built elements i.e. keeping it LowCode / NoCode for my end users.

In my head i thought it would be as simple as adding a custom attribute to a cornerstone button element but this doesn’t work and on inspecting the code the onclick attribute is added to the a tag but this is obviously wrong . I feel i am just missing the knowledge of how cornerstone elements can use custom JS. A point in the right direction would be much appreciated.
I do now that you have the One service but i would like to build my knowledge so i can better understand how the Cornerstone NoCode/LowCode environment works with JavaScript.

Many thanks in advance for any advice you can provide

Hey @The_Capture_Factory,

Thanks for reaching out!

Providing custom JS/jQuery code is outside the scope of our theme support. If you wish some guidance with JS/jQuery coding, you may check our One service where we answer questions outside the scope of our theme support.

Thank you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.