0

Estou tentando alterar um keyframe CSS, na verdade fazer um update, mas não estou conseguindo concatenar variáveis CSS à javaScript.

A ideia, na verdade, nem é alterar. Mas sim, inserir no final do keyframe as linhas criadas

Como corrigir isso?

       tMin = 0;
       tMax = 20;
       tempoImagens = 20;

       $("@keyframe animacao").css({        

          tMin + "% : margin-left:-" + tempoImagens + "%",
          tMax + "% : margin-left:-" + tempoImagens + "%"   

       });

Está dando erro na concatenação.

   tMin + "% : 
6
  • Vc já testou isso? Pq o jQuery retorna erro ao colocar uma arroba (@) no selector: $("@keyframe animacao")
    – Meu ovo
    25/10/2017 às 10:53
  • Sim, de fato deu erro. Mas substitui para $("<style>@keyframe tocaSlide").css(, e o erro passou, porém o keyframe não está sendo populado. 25/10/2017 às 10:56
  • Em vez de fazer assim .css({ vária linhas }), tenta do modo simples .css('estilo','valor')
    – Meu ovo
    25/10/2017 às 10:59
  • Não dá pois não sei os valores que serão utilizados nem quantas imagens serão colocadas. Só preciso arranjar uma forma de fazer esse keyframe funcionar. Isto é, popular ele, 25/10/2017 às 11:00
  • Bom, mas nesse formato de múltiplas linhas do .css() vc não irá conseguir fazer concatenação do lado esquerdo do :...
    – Meu ovo
    25/10/2017 às 11:03

1 Resposta 1

0

Isso acontece porque você está criando uma variável e setando seu valor inicial como inteiro. Daí quando você tenta concatenar, o interpretador "acha" que você está tentando somar, daí ele dá erro, tipo: "COMO SOMAR 20 + 'texto'".

Ao invés de colocar isso:

tMin = 0;
tMax = 20;
tempoImagens = 20;

Coloque isso:

tMin = "0";
tMax = "20";
tempoImagens = "20";

Ou você também pode converter o valor de inteiro para texto antes de tentar a concatenação!

1
  • Acredito que isso não aconteça porque ao haver uma string em meio a declaração, o interpretador assume como concatenação. Ex: ""+ 5 + 10 == "510"; 31/01/2018 às 14:06

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .