Permalink
Browse files

rework the ui of the masthead

  • Loading branch information...
1 parent 70aa2fc commit 272234c61a70d49a7e02eb3311cd330916581c0c tristen committed Dec 5, 2012
Showing with 30 additions and 12 deletions.
  1. +10 −9 global.css
  2. +4 −1 site.css
  3. +16 −2 site.js
View
@@ -87,21 +87,22 @@
}
#t-toggle {
- background:#303030;
+ background:#292929;
height:30px;
display:block;
position:absolute;
width:100%;
bottom:0;left:0;right:0;
- -webkit-transition: background-color 0.1s linear;
- -moz-transition: background-color 0.1s linear;
- -o-transition: background-color 0.1s linear;
- transition: background-color 0.1s linear;
+ opacity:1;
+ -webkit-transition:opacity 250ms linear;
+ -moz-transition:opacity 250ms linear;
+ -o-transition:opacity 250ms linear;
+ transition:opacity 250ms linear;
}
- .active #t-toggle,
- #t-toggle:hover {
- background:#292929;
+ #masthead.active #t-toggle {
+ opacity:0;
}
+
#t-toggle span {
background:transparent url(images/global.png) no-repeat -40px 0;
position:absolute;
@@ -114,7 +115,7 @@
line-height:20px;
text-align:center;
text-indent:-999em;
- opacity:0.75;
+ opacity:0.65;
-webkit-border-radius:50%;
border-radius:50%;
}
View
@@ -104,7 +104,7 @@ h2 {
h3 {
font-size:15px;
line-height:1.333em;
- margin:0 0 20px;
+ margin:0 0 10px;
}
h4 {
@@ -140,6 +140,9 @@ table {
.reset td {
padding:8px 0;
}
+ td.date {
+ text-align:right;
+ }
th {
font-weight: bold;
View
18 site.js
@@ -1,3 +1,7 @@
+// hoverintent.js
+// tristen @fallsemo
+!function(e,t,n){function l(t,n,r){t.attachEvent?(t["e"+n+r]=r,t[n+r]=function(){t["e"+n+r](e.event)},t.attachEvent("on"+n,t[n+r])):t.addEventListener(n,r,!1)}function c(e,t,n){e.detachEvent?(e.detachEvent("on"+t,e[t+n]),e[t+n]=null):e.removeEventListener(t,n,!1)}var r,i,s,o,u=0,a=0,f=function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var i in r)e[i]===n&&(e[i]=r[i])}return e},h={sensitivity:7,interval:100,timeout:0},p=function d(e){if(!this.hover)return new d(e);this.options=f(e||{},d.options,h)};p.options={},f(p.prototype,{hover:function(e,t,n){var r=this;return e&&(l(e,"mouseover",function(e){r.dispatch(e,t,!0)}),l(e,"mouseout",function(e){r.dispatch(e,n)})),r},track:function(e){return r=e.pageX,i=e.pageY,this},compare:function(e,t,n){var f=this;a&&(a=clearTimeout(a));if(Math.abs(s-r)+Math.abs(o-i)<f.options.sensitivity)return c(e,"mousemove",f.track),u=1,t.call(e,n);s=r,o=i,a=setTimeout(function(){f.compare(e,t,n)},f.options.interval)},delay:function(e,t,n){return a&&(a=clearTimeout(a)),u=0,t.call(e,n)},dispatch:function(e,t,n){var r=this,i=e.currentTarget;return a&&(a=clearTimeout(a)),n?(s=e.pageX,o=e.pageY,l(i,"mousemove",r.track(e)),u!==1&&(a=setTimeout(function(){r.compare(i,t,e)},r.options.interval))):(c(i,"mousemove",r.track(e)),u===1&&(a=setTimeout(function(){r.delay(i,t,e)},r.options.timeout))),r}}),e.HoverIntent=p}(window,document);
+
function addEvent(object, event, method) {
if (object.attachEvent) {
object['e' + event + method] = method;
@@ -44,9 +48,19 @@ function addEvent(object, event, method) {
var p = document.getElementById('tristen-projects');
addEvent(document.getElementById('t-toggle'), 'click', function(e) {
that._cancel(e);
- m.className !== 'active' ? m.className = 'active' : m.className = '';
+ m.className = 'active';
});
+ var options = {
+ timeout:500
+ }
+
+ var mastheadHover = new HoverIntent(options).hover(m, function() {
+ // nothing.
+ }, function(e) {
+ this.className = '';
+ }, options);
+
for (var i = 0; i < this.projects.length; i++) {
var li = document.createElement('li');
li.innerHTML = '<a href="' + this.projects[i].url + '">' + this.projects[i].name + '</a>' +
@@ -119,7 +133,7 @@ function addEvent(object, event, method) {
var up = document.createElement('div');
up.className = 'm-popup';
up.innerHTML = '<span class="date">' + f.properties.dates + '</span>' +
- '<h2>' + f.properties.title + '</h2>' +
+ '<h3>' + f.properties.title + '</h3>' +
'<p>' + f.properties.description + '</p>';
p.appendChild(up);

0 comments on commit 272234c

Please sign in to comment.