This commit is contained in:
Marc Cataford 2015-06-21 01:08:18 -04:00
parent 46d6de426c
commit c1d4c88c2c
3 changed files with 57 additions and 24 deletions

View file

@ -1,4 +1,15 @@
//Pageload animations.
$(window).ready(function() {
$("#header_title").fadeIn(800);
$("#header_blurb").delay(300).fadeIn(800);
$("#skillset .section_header").delay(1100).animate({width:"show"},800);
$("#experience .section_header").delay(1100).animate({width:"show"},800);
$("#projects .section_header").delay(1100).animate({width:"show"},800);
});
//Expanding sections.
$(".section_header h1").click(function() {
console.log("Yo");
});

View file

@ -35,8 +35,10 @@
</div>
</div>
<div id="skillset">
<div id="skillset_header" class="section_header"><h1 class="nomargin">Skillset</h1></div>
<div id="skillset_contents" class="invisible">
<div class="section_header fleft clearb fullwidth invisible">
<center><h1 class="nomargin centered">Skillset</h1></center>
</div>
<div class="contents">
<ul class="nomargin pad5">
<li>I comfortably program in <b>Java</b>,<b>C/C++</b>,<b>PHP</b> and <b>Javascript</b>.</li>
<li>I can also use <b>jQuery</b>,<b>HandlebarsJS</b>,<b>MongoDB</b> and <b>MySQL</b> without problems.</li>
@ -46,8 +48,10 @@
</div>
<div id="experience">
<div id="exp_header" class="section_header"><h1 class="nomargin">Experience</h1></div>
<div id="exp_contents" class="invisible">
<div class="section_header fright clearb fullwidth invisible">
<center><h1 class="nomargin">Experience</h1></center>
</div>
<div class="contents">
<script id="exp-template" type="text/x-handlebars-template">
{{#each experiences}}
@ -62,8 +66,11 @@
</script>
</div>
</div>
<div id="projects"></div>
<div id="callmemaybe"></div>
<div id="projects">
<div class="section_header fleft clearb fullwidth invisible">
<center><h1 class="nomargin">Projects</h1></center>
</div>
</div>
</div> <!-- endof: page wrapper -->
</body>

View file

@ -30,25 +30,40 @@
height: 50%;
}
#skillset_header {
background-color: #DE5235;
.contents {
display: none;
}
#skillset_contents {
#skillset .section_header {
background-color: #1F7A7A;
}
#skillset .contents {
background-color: #DB7B67;
}
#exp_header {
background-color: #35C1DE;
#experience .section_header {
background-color: #29A3A3;
}
#exp_contents {
#experience .contents {
display: none;
background-color: #62C9DE;
background-color: #33CCCC;
}
#projects .section_header {
display: none;
background-color: #33CCCC;
}
.nomargin { margin: 0 0; }
.invisible { display: none; }
.pad5 { padding: 0 5; }
.fullwidth { width: 100%; }
.fleft { float: left; }
.fright { float: right; }
.clearb { clear: both; }
.centered { align: center; }