Add files via upload

hahada5 · Mar 26, 2020 · a35bd25 · a35bd25
1 parent c500d7f
commit a35bd25
Show file tree

Hide file tree

Showing 5 changed files with 91 additions and 0 deletions.
diff --git a/images/2.png b/images/2.png
diff --git a/images/3.png b/images/3.png
diff --git a/index.html b/index.html
@@ -0,0 +1,27 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>My test page</title>
+    <link href="styles/style.css" rel="stylesheet" type="text/css">
+    <link href="https://fonts.googleapis.com/css?family=Ubuntu&display=swap" rel="stylesheet">
+  </head>
+
+  <body>
+    <h1> My test project.</h1>
+    <button>Change user</button>
+    <p>My cat is <strong>very</strong> grumpy.</p>
+    <p>Link is at<a href="https://www.mozilla.org/zh-TW/about/manifesto/">Mozilla Manifesto</a></p>
+    <p>At Mozilla, we’re a global community of</p>
+      <ul>
+        <li>technologists</li>
+        <li>thinkers</li>
+        <li>builders</li>
+      </ul>
+    <p>working together ... </p>
+
+    <img src="images/2.png"  width=80% alt="My test image">
+    <script src="scripts/main.js"></script>
+
+  </body>
+</html>
diff --git a/scripts/main.js b/scripts/main.js
@@ -0,0 +1,30 @@
+
+var myImage = document.querySelector('img');
+
+myImage.onclick = function() {
+    var mySrc = myImage.getAttribute('src');
+    if(mySrc === 'images/3.png') {
+      myImage.setAttribute ('src','images/2.png');
+    } else {
+      myImage.setAttribute ('src','images/3.png');
+    }
+}
+
+var myButton = document.querySelector('button');
+var myHeading = document.querySelector('h1');
+function setUserName() {
+  var myName = prompt('Please enter your name.');
+  localStorage.setItem('name', myName);
+  myHeading.innerHTML = 'Hi, ' + myName;
+}
+
+if(!localStorage.getItem('name')) {
+  setUserName();
+} else {
+  var storedName = localStorage.getItem('name');
+  myHeading.innerHTML = ' Hi, ' + storedName;
+}
+
+myButton.onclick = function() {
+  setUserName();
+}
diff --git a/styles/style.css b/styles/style.css
@@ -0,0 +1,34 @@
+html{
+  font-size: 14px;
+  font-family: 'Ubuntu', sans-serif;
+  background-color: black;
+}
+
+body {
+  width: 600px;
+  margin: 0 auto;
+  background-color: #f6f0ee;
+  padding: 0 20px 20px 20px;
+  border: 5px solid grey;
+}
+
+h1 {
+  font-size: 60px;
+  text-align: center;
+  margin: 0;
+  padding: 20px 0;
+  color: #00539F;
+  text-shadow: 0px 3px 6px black;
+}
+
+p, li {
+  color: black;
+  font-size: 16px;
+  line-height: 2;
+  letter-spacing: 1px;
+}
+
+img {
+  display: block;
+  margin: 0 auto;
+}