Undress Monkeys Button (DOM Change)

NathanShih04 · Sep 14, 2021 · 5818ef9 · 5818ef9
1 parent 4d62501
commit 5818ef9
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 2 deletions.
diff --git a/static/hairlessApe.jpg b/static/hairlessApe.jpg
diff --git a/templates/about/colinabout.html b/templates/about/colinabout.html
@@ -17,10 +17,33 @@
         <body style="background-color: darkolivegreen;"</body>
         <h1>About Colin</h1>
     </div>
-    <p>My name is Colin. I'm a junior with no experience or background in coding or website building.
+        </p>My name is Colin. I'm a junior with no experience or background in coding or website building.
         I joined comp sci because I wanted to understand computers and how everything 'behind the scenes' works.
         I also like monkeys very much and so I feel that this group is a good fit for me, considering the other
         members' taste for monkeys and turtles as well.</p>
+
+</body>
+</html>
+
+<button onclick="MonkeyFunction()">Undress the Monkeys</button>
+
+<p>
+    <img alt="/static/hairlessApe.jpg" src="/static/MonkeyMaids.jpg"
+         style="height: 400px; width: 350px" id="MonkeyButton" onclick="MonkeyFunction()"  />
+</p>
+
+<script language="javascript">
+    function MonkeyFunction() {
+
+        if (document.getElementById("MonkeyButton").src == "/static/MonkeyMaids.jpg")
+        {
+            document.getElementById("MonkeyButton").src = "/static/MonkeyMaids.jpg";
+        }
+        else
+        {
+            document.getElementById("MonkeyButton").src = "/static/hairlessApe.jpg";
+        }
+    }
+</script>
 </body>
 </html>
-<img src="/static/MonkeyMaids.jpg" width="400" height="400" class="d-inline-block align-center" alt="">