diff options
| author |   Jason A. Donenfeld <Jason@zx2c4.com> | 2011-05-08 02:57:27 -0400 |
|---|---|---|
| committer | Jason A. Donenfeld <Jason@zx2c4.com> | 2011-05-08 02:57:27 -0400 |
| commit | e5f9ec18ea5dc1f2bd0aaf70efd916ec3b86ae5a (patch) | |
| tree | 4655cd4342ff4b661951dbfcbc8b90a12f833c0d /web | |
| parent | Auto meta-data height. (diff) | |
| download | PhotoFloat-e5f9ec18ea5dc1f2bd0aaf70efd916ec3b86ae5a.tar.xz PhotoFloat-e5f9ec18ea5dc1f2bd0aaf70efd916ec3b86ae5a.zip | |
Chiller arrows.
Diffstat (limited to 'web')
| -rw-r--r-- | web/css/000-controls.css | 13 | ||||
| -rw-r--r-- | web/index.html | 4 | ||||
| -rw-r--r-- | web/js/010-control.js | 6 |
3 files changed, 16 insertions, 7 deletions
diff --git a/web/css/000-controls.css b/web/css/000-controls.css index 435346b..7fcdb0f 100644 --- a/web/css/000-controls.css +++ b/web/css/000-controls.css @@ -6,11 +6,11 @@ body { color: #FFFFFF; } a { - color: #88EE44; + color: #84AAC2; text-decoration: none; } a:hover { - color: #DDDDDD; + color: #FFAD27; } #title { position: absolute; @@ -59,16 +59,19 @@ a:hover { #next, #back { position: absolute; width: auto; - font-size: 2.5em; + font-size: 4.5em; line-height: 0; top: 40%; font-weight: bold; + opacity: 0.35; + -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=35)"; + filter: alpha(opacity=35); } #back { - left: .5em; + left: 0.1em; } #next { - right: .5em; + right: 0.1em; } #photo { border: 0; diff --git a/web/index.html b/web/index.html index 99a6460..df3ee77 100644 --- a/web/index.html +++ b/web/index.html @@ -26,8 +26,8 @@ </div> </div> - <a id="back">←</a> - <a id="next">→</a> + <a id="back">‹</a> + <a id="next">›</a> </div> <div id="error">Forgot my camera.</div> diff --git a/web/js/010-control.js b/web/js/010-control.js index 47d85e6..3fe70f8 100644 --- a/web/js/010-control.js +++ b/web/js/010-control.js @@ -300,6 +300,12 @@ $(document).ready(function() { $("#photo-box").mouseleave(function() { $("#photo-links").stop().fadeOut("slow"); }); + $("#next, #back").mouseenter(function() { + $(this).fadeTo("slow", 1); + }); + $("#next, #back").mouseleave(function() { + $(this).fadeTo("slow", 0.35); + }); $("#metadata-link").click(function() { if (!$("#metadata").is(":visible")) $("#metadata").stop() |