Commit 0b2adb5b1d816cfccc17f95227c4f41f183ed5de
1 parent
e010c399
Better animation
Showing
2 changed files
with
21 additions
and
8 deletions
Show diff stats
css/crep.css
js/crep.js
| @@ -44,23 +44,35 @@ function loadDoc(location, callback) { | @@ -44,23 +44,35 @@ function loadDoc(location, callback) { | ||
| 44 | var eventsLeft = 2 | 44 | var eventsLeft = 2 |
| 45 | var html = '' | 45 | var html = '' |
| 46 | 46 | ||
| 47 | + var mainContainer = $("#mainContainer") | ||
| 48 | + var oldHeight = mainContainer.height() | ||
| 49 | + | ||
| 47 | function events() { | 50 | function events() { |
| 48 | eventsLeft += -1 | 51 | eventsLeft += -1 |
| 49 | if (eventsLeft <= 0) { | 52 | if (eventsLeft <= 0) { |
| 53 | + // In | ||
| 54 | + // Calculations | ||
| 50 | mainContainer.html(html) | 55 | mainContainer.html(html) |
| 51 | - dynamiseLinks(mainContainer) | ||
| 52 | - pageSpecific(location) | 56 | + mainContainer.height('auto') |
| 57 | + newHeight = mainContainer.height() | ||
| 58 | + mainContainer.height(oldHeight) | ||
| 59 | + // Transition | ||
| 53 | mainContainer.animate({ | 60 | mainContainer.animate({ |
| 54 | - height: "toggle", | 61 | + height: newHeight, |
| 55 | opacity: 1 | 62 | opacity: 1 |
| 63 | + }, 'fast', function () { | ||
| 64 | + mainContainer.height('auto') | ||
| 65 | + dynamiseLinks(mainContainer) | ||
| 66 | + pageSpecific(location) | ||
| 67 | + callback() | ||
| 56 | }) | 68 | }) |
| 57 | - callback() | ||
| 58 | } | 69 | } |
| 59 | } | 70 | } |
| 60 | - var mainContainer = $("#mainContainer") | 71 | + // Out |
| 72 | + mainContainer.height(oldHeight) | ||
| 61 | mainContainer.animate({ | 73 | mainContainer.animate({ |
| 62 | - height: "toggle", | ||
| 63 | - opacity: 0 | 74 | + // height: "toggle", |
| 75 | + opacity: 0.25 | ||
| 64 | }, 'fast', events) | 76 | }, 'fast', events) |
| 65 | $.get(location + '?c', function (data) { | 77 | $.get(location + '?c', function (data) { |
| 66 | html = data | 78 | html = data |