Um player pequeno e personalizável, semelhante ao YouTube, para cronogramas GSAP (GreenSock)
Página de demonstração do projeto: http://s.codepen.io/sdras/debug/Mpjxxq/
O uso mais simples possível é carregar gsap-player.js antes da tag body de fechamento (você não precisa do arquivo CSS) e implementar:
gsapPlayer ( { playerTL : yourtimelinehere } ) ;
Isso anexará o player ao document.body. O nome padrão da linha do tempo é tl
, se você estiver usando tl, você só precisa chamar gsapPlayer();
O GSAP Player terá como padrão um tema escuro, mas você também pode configurar um tema claro:
gsapPlayer ( { light : true } ) ;
Por padrão, o player GSAP terá 80% de largura e 40px da parte inferior da janela de visualização. Você pode configurá-lo para ter largura total ou rente à parte inferior, ou um pouco mais alto ou mais baixo. Bottom deve estar em uma string.
gsapPlayer ( {
fullWidth : true ,
bottom : '0'
} ) ;
Se você usar largura total e manter o contêiner padronizado como document.body, certifique-se de ter usado um reset ou colocado margin: 0
no corpo devido a padrões estranhos do navegador.
Por padrão, o player é instanciado no corpo, mas se quiser alterar o pai, você pode fazer:
gsapPlayer ( { container : '#foo' } ) ;
Você precisará colocar position: relativo naquele elemento que contém para incluir o player espacialmente nessa div. Apenas um aviso: isso também não colocará a animação no contêiner (a configuração é mantida separada para maior flexibilidade.
(A licença MIT)
Copyright (c)2017 Sarah Drasner @sarah_edo Todos os direitos reservados.
É concedida permissão, gratuitamente, a qualquer pessoa que obtenha uma cópia deste software e dos arquivos de documentação associados (o 'Software'), para negociar o Software sem restrições, incluindo, sem limitação, os direitos de usar, copiar, modificar, mesclar , publicar, distribuir, sublicenciar e/ou vender cópias do Software e permitir que as pessoas a quem o Software seja fornecido o façam, sujeito às seguintes condições:
O aviso de direitos autorais acima e este aviso de permissão serão incluídos em todas as cópias ou partes substanciais do Software.
O SOFTWARE É FORNECIDO 'TAL COMO ESTÁ', SEM GARANTIA DE QUALQUER TIPO, EXPRESSA OU IMPLÍCITA, INCLUINDO, MAS NÃO SE LIMITANDO ÀS GARANTIAS DE COMERCIALIZAÇÃO, ADEQUAÇÃO A UM DETERMINADO FIM E NÃO VIOLAÇÃO. EM HIPÓTESE ALGUMA OS AUTORES OU DETENTORES DE DIREITOS AUTORAIS SERÃO RESPONSÁVEIS POR QUALQUER RECLAMAÇÃO, DANOS OU OUTRA RESPONSABILIDADE, SEJA EM UMA AÇÃO DE CONTRATO, ATO ILÍCITO OU DE OUTRA FORMA, DECORRENTE DE, OU EM CONEXÃO COM O SOFTWARE OU O USO OU OUTRAS NEGOCIAÇÕES NO SOFTWARE.