mmk2410/morse-converter-web
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Responsible

Browse source
This commit is contained in:
mmk2410 2015-04-02 10:46:06 +02:00
parent 0e70a4d47f
commit 5f52be4cac
4 changed files with 223 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

27
index.html
View file

@ -3,12 +3,17 @@
<title>Morse Converter</title>
<link rel="stylesheet" type="text/css" href="res/css/main.css" />
<script src="./res/js/jquery-2.1.3.min.js"></script>
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/jquery.effects.core.js"></script>
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/ui/jquery.effects.slide.js"></script>
<link rel="shortcut icon" href="./res/img/favicon.png" type="image/x-icon" />
<link rel="image_src" href="./res/img/favicon.png" />
</head>
<body>
<span class="actionbar">Morse Converter</span>
<span class="actionbar">
<img src="./res/img/menu.svg" class="menuicon" onclick="drawer()"/>
Morse Converter
</span>
<div class="drawer">
<img src="res/img/drawergraphic.png" class="drawerimg"/>
<div class="draweritem">writtenMorse</div>
@ -33,10 +38,28 @@
</div>
</body>
<script>
var dur = 150
var drawerStatus = true
function getText(){
var input = $('#textarea').val()
$('#output').text(input)
$('#outputcard').fadeIn(100)
$('#outputcard').fadeIn(dur)
}
function drawer(){
if(window.innerWidth <= 1400){
if(drawerStatus){
$('.drawer').show('slide', {direction: 'left'}, dur)
$('.actionbar').before("<div class='overlay' onclick='drawer()'></div>")
$('.overlay').animate({"opacity":"0.4"}, dur)
drawerStatus = false
} else {
$('.drawer').hide('slide', {direction: 'left'}, dur)
$('.overlay').animate({"opacity":"0"}, dur, function callback (){
$('.overlay').remove()
})
drawerStatus = true
}
}
}
</script>
</html>