diff options
| author | Rene Ae <aehtyb@gmail.com> | 2015-12-08 23:09:37 -0600 |
|---|---|---|
| committer | Rene Ae <aehtyb@gmail.com> | 2015-12-08 23:09:37 -0600 |
| commit | 6f468508553cc7231367d3ed35dba54283bdebb6 (patch) | |
| tree | f6310c68be8feae562d7d722ee469eb920feed7c | |
| parent | ea6860e8d1d8f8b5dac999373feed0a98534f213 (diff) | |
storyview transitions
| -rw-r--r-- | StoneIsland/www/css/account.css | 11 | ||||
| -rw-r--r-- | StoneIsland/www/css/blogs.css | 5 | ||||
| -rw-r--r-- | StoneIsland/www/js/lib/blogs/StoryView.js | 6 |
3 files changed, 14 insertions, 8 deletions
diff --git a/StoneIsland/www/css/account.css b/StoneIsland/www/css/account.css index cfca71de..fbb960d0 100644 --- a/StoneIsland/www/css/account.css +++ b/StoneIsland/www/css/account.css @@ -206,10 +206,11 @@ input[type=text], input[type=password], input[type=number], input[type=email] { } input.switch { - height: 50px; - width: 50px; - opacity: 0; - z-index:9999999; + height: 50px; + width: 50px; + opacity: 0; + z-index: 9999999; + position: relative; } input.switch + label { @@ -221,7 +222,7 @@ input.switch + label { border-radius: 15px; position: absolute; top: 50%; - left: 0; + left: 25px; transform: translateX(-50%) translateY(-50%); } diff --git a/StoneIsland/www/css/blogs.css b/StoneIsland/www/css/blogs.css index 70753fd8..7af45c4f 100644 --- a/StoneIsland/www/css/blogs.css +++ b/StoneIsland/www/css/blogs.css @@ -23,10 +23,11 @@ text-decoration: underline; } #story .content > div { - display: none; +display:none; } #story .content div.active { - display: block; +display:block; +animation: mfadein 0.6s; } .hub #hub { display: block } diff --git a/StoneIsland/www/js/lib/blogs/StoryView.js b/StoneIsland/www/js/lib/blogs/StoryView.js index d0449635..ee7193a6 100644 --- a/StoneIsland/www/js/lib/blogs/StoryView.js +++ b/StoneIsland/www/js/lib/blogs/StoryView.js @@ -58,7 +58,11 @@ var StoryView = ScrollableView.extend({ this.$content.find("[data-id=" + id + "]").addClass("active") var section = this.sections[id] - this.$img.attr("src", section.image.uri) + var replace = this.$img + // optional image transition.. ? + this.$img.fadeTo(110,0.65, function() { + replace.attr("src", section.image.uri) + }).fadeTo(130,1) this.deferScrollToTop() }, |