[Resolvido] Exibir Varias vezes a mesma imagem jQuery

[AprendendoC]

buenas galera estou com um probleminha aqui...

tenho uma tag img no meu html

<img class="sobre" src="certo.png" />

e no meu js tenho

$(".sobre").show(); // escondo a imagem
if(...condição .....){
// aqui faço a imagem aparecer num determinado ponto da tela
$(".sobre").show().css({top: "275px", left: "130px"});
}else if(...condção...){
//aqui faço a mesma coisa so que ele apaga a imagem anterior
$(".sobre").show().css({top: "475px", left: "230px"});
}

queria que a imagem aparece em diferentes partes da imagem sem apagar a posicao anterior...

não sei se me expressei direito...

grato pela Ajuda!

Edited June 17, 2013 at 04:45 PM by AprendendoC

[HappyHippyHippo]

o que tens é :

$("#sobre").show(); // faço aparecer a imagem
if(...condição .....){
// aqui faço que todos os elementos com a class "sobre" apareçam na posição indicada
$(".sobre").show().css({top: "275px", left: "130px"});
}else if(...condção...){
// aqui faço que todos os elementos com a class "sobre" apareçam na posição indicada
$(".sobre").show().css({top: "475px", left: "230px"});
}

Edited June 17, 2013 at 04:44 PM by HappyHippyHippo

[AprendendoC]

o que tens é :

$("#sobre").show(); // faço aparecer a imagem
if(...condição .....){
// aqui faço que todos os elementos com a class "sobre" apareçam na posição indicada
$(".sobre").show().css({top: "275px", left: "130px"});
}else if(...condção...){
// aqui faço que todos os elementos com a class "sobre" apareçam na posição indicada
$(".sobre").show().css({top: "475px", left: "230px"});
}

é isso mesmo que tenho... so que quando ele cai no else if() ele esconde a imagem que esta na posicao {top: "275px", left: "130px"} aparecendo somente a que esta na posicao {top: "475px", left: "230px"} e o que eu quero e que as duas imagens fiquem aparecendo... mas nao sei como posso resolver iso..

ja tentei fazer assim

$("<div id='sobre'>").attr("src", "certo.png").appendTo("#box").css({top: "275px", left: "130px"});

do jeito acima funciona certinho como eu quero, so que na hora que eu vo dar um hide() apaga somente uma imagem ficando as restantes na tela.

[HappyHippyHippo]

volta a ler os comentários que eu alterei no código, sff

[Devexz]

Quanto tu fazes:

$(".sobre").show().css({top: "275px", left: "130px"});

TODOS os elementos com a classe "sobre" vão para aquela posição.

Quando tu fazes:

$(".sobre").show().css({top: "475px", left: "230px"});

TODOS os elementos com a classe "sobre vão para aquela posição.

Edited June 17, 2013 at 05:17 PM by Devexz

[AprendendoC]

o que quero e que quando o usuario clicar na posição ex: (x = 100 e y = 120) apareca a imagem certo.png e quando ele clicar em outra posicao ex: (x = 250 e y = 198) tambem apareca a imagem certo.png mas sem apagar a imagem certo.png que apareceu nas coordenadas (x = 100 e y = 120)!!

o codigo que tenho faz aparecer a imagem nas coordenadas (x = 100 e y = 120) mas quando clico nas coordenadas (x = 100 e y = 120) desaparece a imagem da outra coordenada, quero saber se tem como fazer com que nao desaparece, que a imagem fique em ambas as coordenadas ((x = 100 e y = 120) e (x = 100 e y = 120));

esse linha de codigo faz exatamente o que quero

$("<img id='sobre'").attr("src", "certo.png").appendTo("#box").css({top: "350px", left: "230px"});

aparece uma imagem em cada coordenada que o usuario clicar, sem desaparecer a anterior;

so que nao hora que eu mando esconder as imagens so esconde a ultima, fica a mostra as demais;

ex: se o usuario clicou em 10 coordenadas vai aparecer 10 imagens certo.png na tela, mas quando mando esconder essas 10 imagens

ele so esta escondendo uma, no caso a ultima.

Edited June 18, 2013 at 09:01 AM by brunoais

[yoda]

Como estás a esconder as imagens?

[AprendendoC]

o que tenho é isso..... coloquei uma imagem "certo.png" em cada coordenada que o usuario clica... usando o codigo abaixo

if((e.pageX > 574 && e.pageX < 652) && (e.pageY > 517 && e.pageY < 592)){
               focos++;
               $("#focos").html("Focos : " + focos);
               $("#pontos").html("Pontos : " + (pontos = pontos + 5));
               $("<div id='msg'>").attr("title", "Garrafas").appendTo("#box").html("").dialog();
		    // aqui ele insere a imagem nas coordenadas
               $("<img class='sobre'>").attr("src", "certo.png").appendTo("#box").css({top: "350px", left: "230px"});
           }

pois bem quando o usuario clicar em 10 coordenadas acaba a 1ª fase e comeca a 2ª fase, ai ele deveria esconder essas imagens de "certo.png" que estao aparecendo na imagem acima, mas isso não esta acontecendo, so esta a esconder a imagem do fundo.

o codigo que estou a usar para fazer com que as imagem do funco dessaparecam e este

if(passou){
		    // esconde a imagem do fundo, tah funcinando....
               $("#levelUm").hide();
		    // aqui deveria esconder as imagens "certo.png", mas nao esta acontecendo isso
               $(".sobre").hide();
           }

Edited June 17, 2013 at 06:28 PM by AprendendoC

[yoda]

Troca a order dos hide's, quando fazes hide ao #levelUm ele faz hide de tudo o que está lá dentro. Estou a falar por alto, não tenho a certeza.

[AprendendoC]

Troca a order dos hide's, quando fazes hide ao #levelUm ele faz hide de tudo o que está lá dentro. Estou a falar por alto, não tenho a certeza.

beleza funciono....

coloquei o $(".sobre").hide(); e depois o $("#levelUm").hide(); e esta funcionando beleza...

obrigado pela ajuda!