Point and click adventure

1

Hi guys,

I am trying to create something like a point and click adventure. So I have a “look at” button and when I click on it the cursor changes to eyes. I would like wherever I click with the “eye cursor” to display a message. I am not sure how to do it though.

Thanks a lot
Button.zip (98.2 KB)

And here is the code I am using to transform the cursor to an eye.

document.body.style.cursor = "url('http://folder-one.eu/16.48/eyes.gif'), auto";

2

Hi Dimitris!

Here is a Demo: Button_JHSv2.hype.zip (100.5 KB)

The Demo uses the same “maskTextPopup” function for the “Mouse Over” & “Mouse Out” events.

The Mask is given an ID of “mask_01” and the text pop-up that appears/disappears on Mouse Over/Out is given the ID of “mask01_Clue”.

So when the cursor is set to “eyes” and it hovers over the “Mask” the corresponding pop-up text appears or disappears as appropriate.

This function will work for other elements as well… just make sure that the name of the “mouse over/out” target and the corresponding text pop-up are set to the same name pattern as in this example.

maskTextPopupFunc

1 Like
3

And if we wanted to tighten our code up we could use a “ternary operator” which will replace the “if/else if” scripting sections.

Demo: Button_JHSv3.hype.zip (100.4 KB)

opUpTernary
opUpTernary.png944×196 32.4 KB

The “ternary operator” is on “Line 8”…

We ask if the “display” property is “none” (a question mark “?” is the separation character)

  • if “yes” we make it a “block”… (then a colon “:” as a separator)

  • if “no” (the “display” is a “block”) then we make it “none”.

1 Like
4

Whoops! Just noticed You want to “click” not “hover”…

So just switch the actions from “Mouse Over” & “Mouse Out” to “Mouse Click”.

5

Hi Jim,

Sorry for my late reply. Thank you so much for your help. I really appreciate it. I would never think something like this, the code and the solution seems really advanced for my skills.

1 Like
6

Your Welcome - and any questions about my code, etc. please do not hesitate to ask.

7

Thank you Jim! I am studying the code a bit and I will ask you in case I have any question. Thank you so much again. Have a good day!

1 Like