Skip to main content
adicionou 310 caracteres ao conteúdo
Fonte Link
DontVoteMeDown
  • 2,6mil
  • 15
  • 23

Não sei exatamente porque não funcionou mas suspeito que seja porque a tag img não trabalha com o atributo value. Esse atributo é usado em elementos de formulário. Então se você trocar o .val() para .attr("value") vai resolver.

Fiddle

Mas o correto nesse caso é utilizar os atributos data, exemplo:

<img class="jogo" data-game="lol" src="../cdn/img/jogos/lol.png">png" />
<img class="jogo" data-game="csgo" src="../cdn/img/jogos/csgo.png">png" />

E então para acessar o atributo:

$(this).data("game")

Fiddle

Sobre o efeito da imagens, eu gostaria de sugerir que você usasse esse seletor:

$(".jogo").not(this).animate({opacity:0.5},{duration:100});

Pois assim você não executa esta animação em todos as imagens, apenas nas que não foram clicadas.

Fiddle

Não sei exatamente porque não funcionou mas suspeito que seja porque a tag img não trabalha com o atributo value. Esse atributo é usado em elementos de formulário. Então se você trocar o .val() para .attr("value") vai resolver.

Fiddle

Mas o correto nesse caso é utilizar os atributos data, exemplo:

<img class="jogo" data-game="lol" src="../cdn/img/jogos/lol.png">
<img class="jogo" data-game="csgo" src="../cdn/img/jogos/csgo.png">

E então para acessar o atributo:

$(this).data("game")

Fiddle

Não sei exatamente porque não funcionou mas suspeito que seja porque a tag img não trabalha com o atributo value. Esse atributo é usado em elementos de formulário. Então se você trocar o .val() para .attr("value") vai resolver.

Fiddle

Mas o correto nesse caso é utilizar os atributos data, exemplo:

<img class="jogo" data-game="lol" src="../cdn/img/jogos/lol.png" />
<img class="jogo" data-game="csgo" src="../cdn/img/jogos/csgo.png" />

E então para acessar o atributo:

$(this).data("game")

Fiddle

Sobre o efeito da imagens, eu gostaria de sugerir que você usasse esse seletor:

$(".jogo").not(this).animate({opacity:0.5},{duration:100});

Pois assim você não executa esta animação em todos as imagens, apenas nas que não foram clicadas.

Fiddle

Fonte Link
DontVoteMeDown
  • 2,6mil
  • 15
  • 23

Não sei exatamente porque não funcionou mas suspeito que seja porque a tag img não trabalha com o atributo value. Esse atributo é usado em elementos de formulário. Então se você trocar o .val() para .attr("value") vai resolver.

Fiddle

Mas o correto nesse caso é utilizar os atributos data, exemplo:

<img class="jogo" data-game="lol" src="../cdn/img/jogos/lol.png">
<img class="jogo" data-game="csgo" src="../cdn/img/jogos/csgo.png">

E então para acessar o atributo:

$(this).data("game")

Fiddle