Skip to content

Commit 718e62c

Browse files
sdoransdoran
committed
adding start point for week 6 january 24th
1 parent b9b8bbf commit 718e62c

File tree

7 files changed

+140
-0
lines changed

7 files changed

+140
-0
lines changed

‎mobileWeb/week6/week6_start/README.md

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
# Week 5 January 17th
2+
Lets add some styling
3+
- When we click on the CoderDojo girls logo the bird disappears and reappears right? But the logo doesn't
4+
look like a button - so lets add some style
5+
6+
1. Add a different mouse style
7+
8+
9+
Today we're going to learn some JavaScript:
10+
- Lets learn how to pass variables into our functions!
11+
- Remember, a function has one job to do. How can we make our showBird function better?

‎mobileWeb/week6/week6_start/bird.png

22.8 KB
Loading

‎mobileWeb/week6/week6_start/codergirl.jpg

12.6 KB
Loading

‎mobileWeb/week6/week6_start/index.html

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
<html>
2+
3+
<head>
4+
<title>This is my first app</title>
5+
<link rel="stylesheet" type="text/css" href="style.css"/>
6+
<script type="text/javascript" src="javascript.js"></script>
7+
</head>
8+
<body>
9+
<div id="container">
10+
<h1>CoderDojoGirls gets ready for Spring</h1>
11+
12+
<p class="whiteBg" id="para1">Welcome to DCU</p>
13+
14+
<h2>Hello world! Find me on mycoderdojodcu.com :)</h2>
15+
<p class="whiteBg" id="para2">Today we are going to:
16+
<ul>
17+
<li>Learn more JavaScript</li>
18+
<li>Put our webpage on the internet!</li>
19+
</ul>
20+
</p>
21+
<div id="birdDiv">
22+
<img id="bird" src="bird.png"/>
23+
</div>
24+
<div id="codergirl">
25+
<img src="codergirl.jpg" onClick="hideBird()" ondblclick="showBird()">
26+
<img src="logo.png">
27+
</div>
28+
29+
</div>
30+
31+
</body>
32+
33+
</html>

‎mobileWeb/week6/week6_start/javascript.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
2+
3+
//Change the style of the bird image to hide the picture
4+
function hideBird() {
5+
bird.style.display="none";
6+
}
7+
8+
//Change the style of the bird to show the picture
9+
function showBird() {
10+
bird.style.display="block";
11+
}
12+
13+

‎mobileWeb/week6/week6_start/logo.png

8.61 KB
Loading

‎mobileWeb/week6/week6_start/style.css

Lines changed: 83 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,83 @@
1+
body {
2+
background-image: url(logo.png);
3+
background-repeat: no-repeat;
4+
background-color: green;
5+
padding-top: 70px;
6+
}
7+
8+
h1 {
9+
color: green;
10+
text-shadow: 10px 8px 8px greenyellow;
11+
}
12+
13+
h2 {
14+
color: #66B366;
15+
}
16+
17+
p#para1 {
18+
color: #3f0760;
19+
font-size: 12;
20+
font-family: Tahoma;
21+
}
22+
23+
p#para2 {
24+
color: #0f0217;
25+
font-size: 16;
26+
font-family: Georgia;
27+
}
28+
div#codergirl {
29+
width: 90%;
30+
height: 60%;
31+
}
32+
33+
.whiteBg {
34+
background-color: white;
35+
}
36+
37+
div#container {
38+
width: 80%;
39+
margin-left: auto;
40+
margin-right: auto;
41+
background-color: white;
42+
border: 5px inset greenyellow;
43+
padding: 5%;
44+
}
45+
46+
div#birdDiv {
47+
position: relative;
48+
top: 75px;
49+
left: 105px;
50+
51+
-webkit-animation: moveBird 5s;
52+
animation: moveBird 5s;
53+
}
54+
55+
@-webkit-keyframes moveBird {
56+
from {
57+
left:105px;
58+
}
59+
to {
60+
left:400px;
61+
}
62+
}
63+
64+
#bird {
65+
height: 120px;
66+
width: 120px;
67+
}
68+
69+
70+
71+
72+
73+
74+
75+
76+
77+
78+
79+
80+
81+
82+
83+

0 commit comments

Comments
 (0)