Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Edit tab moves in from top instead of fade in

  • Loading branch information...
commit d23d2508b04708588f411e5cecc2e68f73236491 1 parent 522db49
@remy remy authored aron committed
Showing with 19 additions and 18 deletions.
  1. +10 −9 public/css/edit.css
  2. +9 −9 public/js/render/edit.js
View
19 public/css/edit.css
@@ -2,14 +2,14 @@
opacity: 1;
position: fixed;
top: 0;
- right: 0;
+ right: 5px;
padding-left: 40px;
padding-bottom: 20px;
- -webkit-transition: opacity ease-out 100ms;
- -moz-transition: opacity ease-out 100ms;
- -ms-transition: opacity ease-out 100ms;
- -o-transition: opacity ease-out 100ms;
- transition: opacity ease-out 100ms;
+ -webkit-transition: top ease-out 100ms;
+ -moz-transition: top ease-out 100ms;
+ -ms-transition: top ease-out 100ms;
+ -o-transition: top ease-out 100ms;
+ transition: top ease-out 100ms;
}
#edit-with-js-bin form {
@@ -23,7 +23,7 @@
padding: 0 5px 1px 7px;
border: 1px solid #999;
border-top: 0;
- border-right: 0;
+ /*border-right: 0;*/
background: #ddd;
}
@@ -33,7 +33,7 @@
}
#edit-with-js-bin a {
- /*opacity: 0.9;*/
+ opacity: 0.9;
display: inline-block;
position: relative;
padding: 7px 2px;
@@ -51,7 +51,8 @@
opacity: 0.5;
}
-#edit-with-js-bin button:hover {
+#edit-with-js-bin button:hover,
+#edit-with-js-bin a:hover {
opacity: 1;
}
View
18 public/js/render/edit.js
@@ -4,7 +4,7 @@ function jsbinShowEdit(options) {
var ie = (!+"\v1");
function hide() {
- if (over === false) el.style.opacity = 0;
+ if (over === false) el.style.top = '-60px';
}
var el = document.createElement('div'),
@@ -19,12 +19,12 @@ function jsbinShowEdit(options) {
var over;
el.onmouseover = function () {
over = true;
- this.style.opacity = 1;
+ this.style.top = 0;
};
el.onmouseout = function () {
- this.style.opacity = 0;
over = false;
+ hide();
};
var getEmail = function (event) {
@@ -65,12 +65,12 @@ function jsbinShowEdit(options) {
}, 100);
function show() {
- if (!ie && (el.style.opacity*1) == 0) { // TODO IE compat
- el.style.opacity = 1;
- } else if (ie) {
- el.style.opacity = 1;
- el.style.display = 'block';
- }
+ // if (!ie && (el.style.top*1) == 0) { // TODO IE compat
+ el.style.top = 0;
+ // } else if (ie) {
+ // el.style.top = 1;
+ // el.style.display = 'block';
+ // }
clearTimeout(moveTimer);
moveTimer = setTimeout(hide, 2000);
}
Please sign in to comment.
Something went wrong with that request. Please try again.