diff --git a/css/style.css b/css/style.css index 27455321..66204494 100644 --- a/css/style.css +++ b/css/style.css @@ -44,11 +44,11 @@ body h5 { } .move { - -webkit-transition: margin-left 0.3s ease, margin-right 0.3s ease; - -moz-transition: margin-left 0.3s ease, margin-right 0.3s ease; - -o-transition: margin-left 0.3s ease, margin-right 0.3s ease; - -ms-transition: margin-left 0.3s ease, margin-right 0.3s ease; - transition: margin-left 0.3s ease, margin-right 0.3s ease; + -webkit-transition: margin-left 0.4s ease, margin-right 0.4s ease; + -moz-transition: margin-left 0.4s ease, margin-right 0.4s ease; + -o-transition: margin-left 0.4s ease, margin-right 0.4s ease; + -ms-transition: margin-left 0.4s ease, margin-right 0.4s ease; + transition: margin-left 0.4s ease, margin-right 0.4s ease; } body .form-control { diff --git a/js/app.js b/js/app.js index 10090425..1f8bd294 100644 --- a/js/app.js +++ b/js/app.js @@ -96,24 +96,27 @@ app = Sammy('#main', function (sam) { }); } - blockSize = $('#slider').innerWidth()-20; + blockSize = $('#slider').width(); + // Slide back effect if (store.get('slide') == 'back') { - if ($('#slideBack').is(':visible')) $('#slideBack').hide(); + store.clear('slide'); + $('#slideBack').css('display', 'none'); $('#slider-container').removeClass('move').css('margin-left', '-'+ blockSize +'px'); $('#slideTo').show().html($('#main').html()); leSwap(); $('#slider-container').addClass('move').css('margin-left', '0px'); - store.clear('slide'); + // Slide to effect } else if (store.get('slide') == 'to') { - if ($('#slideTo').is(':visible')) $('#slideTo').hide(); + store.clear('slide'); + $('#slideTo').css('display', 'none'); + $('#slider-container').removeClass('move').css('margin-left', '-'+ blockSize +'px'); $('#slider-container').removeClass('move').css('margin-left', '0px'); $('#slideBack').show().html($('#main').html()); leSwap(); - $('#slider-container').addClass('move').css('margin-left', '-'+ ($('#slider').innerWidth()-10) +'px'); + $('#slider-container').addClass('move').css('margin-left', '-'+ blockSize +'px'); - store.clear('slide'); } else { leSwap(); } @@ -335,10 +338,8 @@ app = Sammy('#main', function (sam) { */ $(document).ready(function () { app.run('#/'); - $('.block').width($('#slider').innerWidth()-20); - $('#slider-container').width(3*$('#slider').innerWidth() +'px'); + $('#slider-container').width(2*$('#slider').width() +'px'); $(window).resize(function() { - $('.block').width($('#slider').innerWidth()-20); - $('#slider-container').width(3*$('#slider').innerWidth() +'px'); + $('#slider-container').width(2*$('#slider').width() +'px'); }); });