Updated landing page. New background, changed mono space font to Hack, added different animation of text

This commit is contained in:
2018-07-15 11:47:47 +02:00
committed by Dennis Potter
parent f4e74bfc14
commit 2edaf86d48
6 changed files with 119 additions and 194 deletions

86
index.html Normal file → Executable file
View File

@@ -58,25 +58,17 @@
<div class="row banner">
<div class="banner-text">
<h1 class="responsive-headline">
<div id="header-hi-div">
<span id="header-hi">[~]$&nbsp;</span>
<span id="header-hi-text"></span>
<h1 class="responsive-headline">
<div class="header-hi-div">
<span id="header-hi-text"></span>
</div>
</h1>
<h3 class="responsive-headline">
<div id="header-eng-div">
<span id="header-eng">[~]$&nbsp;</span>
<span id="header-eng-text"></span>
<p>Electrical & Computer Engineer</p>
</div>
<div id="header-scr-div">
<span id="header-scr">[~]$&nbsp;</span>
<span id="header-scr-text"></span>
</div>
<div id="header-empt-div">
<span id="header-empt">[~]$
<span style="color: #ffffff;"></span>
</span>
</div>
</h1>
</h4>
<ul class="social">
@@ -175,9 +167,7 @@
<p class="info">Gymnasium<span>&bull;</span>
<em class="date">September 2005 - July 2011</em></p>
<p>
Comparable to a university-preparatory school with Latin or Ancient Greek as additional language.
</p>
<p>Comparable to a university-preparatory school with Latin as additional language.</p>
</div>
@@ -619,64 +609,6 @@
<script src="js/init.js"></script>
<script src="js/typed.js"></script>
<script>
function toggle(id) {
document.getElementById(id).style.display = 'inline-block';
}
function sleep(milliseconds) {
var start = new Date().getTime();
for (var i = 0; i < 1e7; i++) {
if ((new Date().getTime() - start) > milliseconds){
break;
}
}
}
/** YAKS, RECURSION **/
var typed = new Typed('#header-hi-text', {
strings: ["Hi, I'm Dennis"],
typeSpeed: 45,
startDelay: 200,
onComplete: function(){
$( "span" ).siblings( ".typed-cursor" ).css( "animation", "none" );
$( "span" ).siblings( ".typed-cursor" ).css( "opacity", "0" );
$( "span" ).siblings( ".typed-cursor" ).css( "position", "fixed" );
sleep(200);
toggle('header-eng');
var typed = new Typed('#header-eng-text', {
strings: ["I'm an electrical engineer and computer scientist"],
typeSpeed: 45,
startDelay: 500,
onComplete: function(){
$( "span" ).siblings( ".typed-cursor" ).css( "opacity", "0" );
$( "span" ).siblings( ".typed-cursor" ).css( "position", "fixed" );
$( "span" ).siblings( ".typed-cursor" ).css( "animation", "none" );
sleep(200);
toggle('header-scr')
var typed = new Typed('#header-scr-text', {
strings: ["Scroll down and learn more"],
typeSpeed: 45,
startDelay: 500,
onComplete: function(){
$( "span" ).siblings( ".typed-cursor" ).css( "animation", "none" );
$( "span" ).siblings( ".typed-cursor" ).css( "opacity", "0" );
$( "span" ).siblings( ".typed-cursor" ).css( "position", "fixed" );
sleep(200);
toggle('header-empt')
}
});
}
});
}
});
</script>
</body>
</html>