Изменение страницы JQuery без эффекта мигания

Как достичь загрузки страницы без вспышки содержимого. У меня есть календарь, и, изменяя месяцы, я могу заставить верхнюю панель оставаться при изменении страниц (используя sammy.js), но когда я меняю месяцы, содержимое мигает, и оно выглядит уродливым. Я пытался затухать и выходить, но не могу заставить его выглядеть хорошо. Будет ли загрузочный образ таким путем? Если да, то как это будет сделано, я довольно новичок в jquery.Изменение страницы JQuery без эффекта мигания

Сейчас мой код

this.get('#/calendar/:month/:year', function(context) { 
       context.app.swap(''); 
       context.$element().fadeOut('slow'); 
       context.$element().load('calshow.php?m=' + this.params['month'] +'&y=' + this.params['year'] +''); 
       context.$element().fadeIn('slow'); 
         });

Заранее спасибо за любую помощь, я в тупике!

источник

2013-05-27 iHeff

выстрел в темноте догадка

попробовать этот

this.get('#/calendar/:month/:year', function(context) { 
       var $currentElement = context.$element(); 

       context.app.swap(''); 
       $currentElement.fadeOut('slow', function(){ 
        $currentElement.load('calshow.php?m=' + this.params['month'] +'&y=' + this.params['year'] +'', function(){ 
         $currentElement.fadeIn('slow'); 
        }); 
       });

EDIT: редактировал пример. Метод fadeOut имеет неполный метод. это может работать лучше для вас.

Отредактировано: обнаружено, что метод загрузки также имеет неполный метод. Мне не нравится привязывать onCompletes как это, но это может сработать для вас. Я также создал переменную для контекста. $ Element(). Я обнаружил, что это помогает, когда вы объединяете такие вещи вместе.

дайте мне знать, как она работает

источник

2013-05-27 01:14:49

Имеет такой же эффект, как мой код выше. Спасибо за попытку! – iHeff

, взглянув на пример, я думаю, что вы хотите исчезнуть, загрузить данные, а затем затухать, но вместо этого загрузка данных перед переходом jquery полностью исчезает ... позвольте мне посмотреть на это и вернуться к нему –

Да , это именно то, что я хочу сделать, но jquery для меня довольно новичок, поэтому я точно не знаю, как это сделать. Но удивительно, спасибо! – iHeff

this.get('#/calendar/:month/:year', function(context) { 
     context.app.swap('-Have to put text here to fill empty space-').effect('fold'); 
     context.$element().load('calshow.php?m=' + this.params['month'] +'&y=' + this.params['year'] +''); 
     context.$element().show('');

Я был возиться с ним и этот код, кажется, работает очень хорошо для того, что я хочу, чтобы это сделать. Это все равно почти то же самое, причудливые эффекты просто маскируют «вспышку».

источник

2013-05-27 12:10:16 iHeff

ОК, просто убедитесь, что вы тестируете это во всех основных браузерах. В разных браузерах (например, IE) эти переходы не выполняются точно так же, и хотя это может работать в хроме, это не будет в IE или firefox. Не сказать, что это не будет работать во всех браузерах, просто совет для тестирования. Надеюсь, это сработает для вас, кроме того, я обновил свой пример ранее с помощью нового подхода, вы можете попробовать, если это не сработает для вас. –

Да, я дал ему тест во всех них, и это даже удивительно работает в IE (обычно я просто пропускаю кодирование для IE, потому что, так что это удобно!) Я думаю, что это то, с чем я поеду, это дает ему аккуратный эффект и делает его выглядящим довольно современным. Кроме того, ваш другой метод тоже не работал, я думаю, что он должен противоречить sammyjs. В любом случае, спасибо! – iHeff

Изменение страницы JQuery без эффекта мигания

ответ

Смежные вопросы