skip to Main Content

(Please understand, English may be a mess.)

Try the first question in here.

I’m a student studying web programming. I make a Web Game. Use HTML, JavaScript. Not use Adobe Flash.

When, how can I select one image on image layers? I made two images. Use a web-photoshop.

  1. BackGround.png

    This image has no function. just background image.

  2. go_Lobby.png

    This image has two function.

    • Function onClick = " go_Lobby() "

      href = "Lobby.html", go to the lobby page.

    • Function onMouseOver = " OverEvent() "

      Using effect at image when your mouse on image.

Below is the code:

<script>
  function go_lobby{<br/>
    location.herf="lobby.html";<br/>
  }
</script>
<body>
  <div style="position:absolute; z-index = 99;">
    <img src = "map.png"/>
  </div>
  <div style="posistion:absolute; z-index = 10;">
    <img src = "go_lobby.png" onclick = " go_lobby() " onMouseOver ="" />
  </div>
</body>

But unlike my idea was to move the page when you click anywhere in the lobby.

How can you move to the page only when selecting the “Lobby” image?

2

Answers


  1. Your JavaScript is flawed.

    • href is spelt incorrectly – so you won’t be redirected.
    • You have <br/> in your JavaScript, which will cause the second line to not execute.
    • You’re missing the parenthesis on the function declaration.

    Change your JavaScript to become the following

    <script>
      function go_lobby() {
        window.location.href = "lobby.html";
      }
    </script>
    

    Now, when you onclick the go_lobby.png image, a call will be made to go_lobby() function, which will redirect the window to lobby.html.

    Test runs

    With your current JavaScript, you would have gotten these errors (looking at the console)

    • SyntaxError: Unexpected token {
    • SyntaxError: Unexpected token <
    • No page redirect
    Login or Signup to reply.
  2. This is an absolute mess..

    JavaScript code should not have HTML tags in it unless it’s inside of a string. Also you have a typo – it’s location.href not location.herf. Furthermore if you’re defining a function in JavaScript it should have a function keyword, function name, function arguments and then the function body. If you want to redirect with JavaScript you can simply use window.location.

    Fix your JavaScript part to the following:

    <script>
        function go_lobby() {
            window.location = "lobby.html";
        }
    </script>
    

    You also have a typo in your HTML. posistion should be position. Empty element attributes are redundant if they aren’t set beforehand. Also if your setting an event event for an event like onclick then the spaces that you have there are just useless and can lead to problems.

    Fix your HTML to:

    <body>
        <div style="position:absolute; z-index = 99;">
            <img src="map.png" />
        </div>
        <div style="position:absolute; z-index = 10;">
            <img src="go_lobby.png" onclick="go_lobby()" />
        </div>
    </body>
    

    After this the image onclick event should trigger the redirect.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search