Help with simple event listener

JavaScript
1

https://codepen.io/TuscannyCodes/pen/jOyNbEb

Im working on a practice page were the user can click a div and the text will change to display new text. The best way I could thing of doing this is by swapping the text off the page and switching in the new text onto the page via a click event.

Im having a problem with this, I believe because im getting the syntax of the function wrong… Can someone help me out here? What am I doing wrong? how can I create a click event that changes the ‘top’ value of of my divs allowing me to click and change the text on the page?

2

You can edit the displayed text by updating the textContent property (Node.textContent - Web APIs | MDN).

Here’s an example: https://codepen.io/colinthornton/pen/gOgYajO

1 Like
3

Thanks. I will try this. However, I do prefer to manipulate this using a listener event that changes the style.top value on click. Any idea how to do this?

4

Ok I fixed it. I just had to play around with the syntax of the listener.

I prefer to do it this way (by manipulating the ‘top’ value) because I feel that it will be easier to create text and have them floating out of view, then just swap them out when I need them rather than changing any of the existing text.

https://codepen.io/TuscannyCodes/pen/jOyNbEb

5

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