 HTML with Javascript button help!, Help creating button with image and text |
| chelsearussell |
 Sep 23 2017, 04:27 PM
Post
#1
|
|
Group: Members Posts: 1 Joined: 23-September 17 Member No.: 26,504  |
Hello! I am in a beginner programming class. We are only on chapter 4, so please keep that in mind. This class is using HTML with some javascript, we haven't really gotten too deep into javascript yet. My project for this week is to create two buttons, and when each one of these buttons are clicked a photo and a paragraph comes up. I have the button with the paragraph coming up but I can't figure out how to add the image. Everything I have found on the internet is super javascript, stuff I haven't learned. Here is my code, I just picked a random topic, haha
<!doctype html> <!--Web page that displays quotes at the click of a button click. --> <!--============================================================= --> <html> <head> <title>Project2</title> </head> <body> <div style="text-align:center"> <p> <h2> <span style="color:red">Favorite Animals</span> </h2> </p> <input type="button" value="Slow Loris" onmouseover="this.style.backgroundColor='red';" onmouseout="this.style.backgroundColor='white';" onclick="document.getElementById('outputDiv').innerHTML= 'This animal might look like a harmless, big-eyed baby ewok, but ' + 'the slow loris is one of the only venomous mammals in the world. ' + 'Its subtle nature makes it popular in the illegal pet trade, but this ' + 'furry creature also carries a toxin that is released from the brachial ' + 'gland on the sides of its elbows. If threatened, the loris can take ' + 'the toxin into its mouth and mix it with saliva. The animal may also ' + 'lick or rub its hair with this mixture to deter predators from attack. ' + 'The toxin can cause death by anaphylactic shock in some people.';"> <input type="button" value="Sloth" onmouseover="this.style.backgroundColor='red';" onmouseout="this.style.backgroundColor='white';" onclick="document.getElementById('outputDiv').innerHTML= 'Sloths—the sluggish tree-dwellers of Central and South America—spend ' + 'their lives in the tropical rain forests. They move through the canopy ' + 'at a rate of about 40 yards per day, munching on leaves, twigs and buds. ' + 'Sloths have an exceptionally low metabolic rate and spend 15 to 20 hours ' + 'per day sleeping. And surprisingly enough, the long-armed animals are ' + 'excellent swimmers. They occasionally drop from their treetop perches ' + 'into water for a paddle.';"> </div> <div id="outputDiv"></div> </body> </html> |
  |
 
|
Posts in this topic
chelsearussell HTML with Javascript button help! Sep 23 2017, 04:27 PM
Christian J Hello! :)
I have the button with the parag... Sep 23 2017, 06:22 PM  |
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:
|
Lo-Fi Version | Time is now: 25th April 2024 - 03:46 PM |
Invision Power Board
© 2024 IPS, Inc.
Licensed to: HTMLHelp.com, LLC