Skip to content

Commit

Permalink
menu works
Browse files Browse the repository at this point in the history
  • Loading branch information
Mihael Šandro authored and Mihael Šandro committed Oct 19, 2017
0 parents commit af3b0ec
Show file tree
Hide file tree
Showing 6 changed files with 130 additions and 0 deletions.
5 changes: 5 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
# https://git-scm.com/docs/gitignore
# https://help.github.com/articles/ignoring-files
# Example .gitignore files: https://github.com/github/gitignore
/bower_components/
/node_modules/
27 changes: 27 additions & 0 deletions css/style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
.menu {
width: 750px;
height: 750px;
}

polygon {
transition: all 0.5s;
}

.moveFirst {
transform: translate(70px, 10px) rotate(45deg);
}
.moveCss{
transform: translate(130px, 10px) rotate(60deg);
}

.moveHtml{
transform: translate(190px, 10px) rotate(60deg);
}

.moveKnow{
transform: translate(250px, 10px) rotate(60deg);
}

.movePipe{
transform: translate(310px, 10px) rotate(60deg);
}
16 changes: 16 additions & 0 deletions css/triangle 1.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
19 changes: 19 additions & 0 deletions css/triangle_1.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
42 changes: 42 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
<!DOCTYPE html>
<html lang="">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/style.css">
<title></title>
</head>

<body>

<div id="burger" class="menu">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 452.4 144.2" style="enable-background:new 0 0 52.4 44.2;" xml:space="preserve">
<style type="text/css">
.st0{fill:#FFFEFE;}
</style>
<polygon id="js" points="0,22.1 0,0 26.2,11.1 52.4,22.1 26.2,33.2 0,44.2 "/>
<polygon id="css" points="0,22.1 0,0 26.2,11.1 52.4,22.1 26.2,33.2 0,44.2 "/>
<polygon id="html" points="0,22.1 0,0 26.2,11.1 52.4,22.1 26.2,33.2 0,44.2 "/>
<polygon id="git" points="0,22.1 0,0 26.2,11.1 52.4,22.1 26.2,33.2 0,44.2 "/>
<polygon id="pp" points="0,22.1 0,0 26.2,11.1 52.4,22.1 26.2,33.2 0,44.2 "/>
<polygon id="topitem" points="0,22.1 0,0 26.2,11.1 52.4,22.1 26.2,33.2 0,44.2 "/>
<g>
<path id="topitem" class="st0" d="M23,15.4c0,0.6-0.5,1.1-1.1,1.1H6.1c-0.6,0-1.1-0.5-1.1-1.1v-0.7c0-0.6,0.5-1.1,1.1-1.1h15.8
c0.6,0,1.1,0.5,1.1,1.1V15.4z M23,21.5c0,0.6-0.5,1.1-1.1,1.1H6.1c-0.6,0-1.1-0.5-1.1-1.1v-0.7c0-0.6,0.5-1.1,1.1-1.1h15.8
c0.6,0,1.1,0.5,1.1,1.1V21.5z M23,27.5c0,0.6-0.5,1.1-1.1,1.1H6.1c-0.6,0-1.1-0.5-1.1-1.1v-0.7c0-0.6,0.5-1.1,1.1-1.1h15.8
c0.6,0,1.1,0.5,1.1,1.1V27.5z"/>
</g>
</svg>
</div>
<!--
<div id="javascript" class="menu1"></div>
<div class="menu1"></div>
<div class="menu1"></div>
<div class="menu1"></div>
<div class="menu1"></div>-->

<script src="java.js"></script>
</body>

</html>
21 changes: 21 additions & 0 deletions java.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
let menu = document.querySelector("#topitem");
let triangles = document.querySelector("#navbar")
//let javaScript = document.querySelector("#javascript")
menu.addEventListener('click', menuUnfolds);

function menuUnfolds() {
//javaScript.classList.add("js");
console.log("clicked")
let javaScript = document.querySelector('#js');
javaScript.classList.toggle("moveFirst");
let Css = document.querySelector('#css');
Css.classList.toggle("moveCss");
let htMl = document.querySelector('#html');
htMl.classList.toggle("moveHtml");
let know = document.querySelector('#git');
know.classList.toggle("moveKnow");
let pipePiper = document.querySelector('#pp');
pipePiper.classList.toggle("movePipe");


}

0 comments on commit af3b0ec

Please sign in to comment.