javascript - How to display an image when pressing a button in html? -


i thought doing have worked, i'm confused why isn't when style hiding image begin with, not showing when button pressed. here's code:

function showimg() {     x=document.getelementbyid("map_img")     x.style.visibility="visible"; }  <body>     <img id="map_img" src="map.jpg" style="visibility:hidden" width="400" height="400"/>      <form id="form1" name="form1" align="center">         <input type="submit" id="map" value="map" onclick="showimg()"/>     </form> 

i've tried in both situations:

<input type=button id="map" value="map" onclick="showimg()"/> 

and:

<style>     .hidden{display:none;}     .show{display:block;} </style>  function showimg() {     x=document.getelementbyid("map_img")     x.class="show"; }  <body>     <img id="map_img" src="map.jpg" class="hide" width="400" height="400"/>      <form id="form1" name="form1" align="center">         <input type="submit" id="map" value="map" onclick="showimg()"/>     </form> 

i'm lost how neither of these worked, on please?

you shouldn't* wrap input element in form if don't want standard submit behavior.

in code written, form triggers page load or error, prevents script running.


Comments

Popular posts from this blog

SPSS keyboard combination alters encoding -

Add new record to the table by click on the button in Microsoft Access -

CSS3 Transition to highlight new elements created in JQuery -