SVG анимация при загрузке страницы во всех браузерах, кроме Chrome - PullRequest
Новая
       35

SVG анимация при загрузке страницы во всех браузерах, кроме Chrome

0 голосов
/ 15 мая 2019

Итак, у меня есть анимация SVG при первой загрузке страницы.Это будет отображаться только один раз, когда index.html загружен и работает так, как задумано, во всех браузерах, кроме chrome для Mac.Однако анимация будет загружаться при обновлении страницы.

Анимации используют GSAP и плагин DrawSVG.

Я использую barbajs для внутренних страниц.

Я добавил основныепереходит в barbas onEnter: funtion () {}, который работает как положено.Когда индекс загружается впервые, SVG просто появляется и исчезает.Это должно быть рисование, которое работает в других браузерах.

Я пытался добавить те же анимации в переход по умолчанию 'fadeIn', но почему это будет работать в других браузерах? 

var Indexpage = Barba.BaseView.extend({

namespace: 'indexpage', onEnter: function () {

var drawlogo = new TimelineMax();

TweenMax.from("main.home",8,{autoAlpha:0});
TweenMax.from(".logotop",2,{autoAlpha:0});
TweenMax.from(".frontlogo1,.frontlogo2",5,{drawSVG:0});

TweenMax.to("main.home",1,{autoAlpha:0,delay:5});
TweenMax.to(".logotop",1,{autoAlpha:0,delay:5});
TweenMax.to(".frontlogo1,.frontlogo2",1,{autoAlpha:0,delay:5});

TweenMax.from(".logoblue",2,{autoAlpha:1,x:-220,ease: Expo.easeOut,delay:4.8});
TweenMax.from(".burger",1,{autoAlpha:1,x:100,ease: Expo.easeOut,delay:4.6});

TweenMax.to("#intro",3,{autoAlpha:1,ease:Expo.easeOut,delay:5.8});
TweenMax.to("#sectionone",3,{autoAlpha:1,ease:Expo.easeOut,delay:6});
TweenMax.to("#sectiontwo",3,{autoAlpha:1,ease:Expo.easeOut,delay:6.2});
TweenMax.to("#sectionthree",3,{autoAlpha:1,ease:Expo.easeOut,delay:6.4});
TweenMax.to("#contactus",3,{autoAlpha:1,ease:Expo.easeOut,delay:6.6});

console.log("enter");},
...