JQuery - Como cambiar url de un background (css) por la url de un img (en el html) gracias

   
Vista:
Imágen de perfil de Edwing

Como cambiar url de un background (css) por la url de un img (en el html) gracias

Publicado por Edwing (11 intervenciones) el 24/06/2016 16:54:26
Buen día, agradecería mucho si me colaboran para saber como hago en jquery para que un div cambie la url de su background (es decir desde el css) por la url de una imagen (de un img) desde el html en el atributo "src" al hacer click en dicha imagen, la verdad no le doy a lograr que una variable que tome la url del atributo "src" en el html remplace al valor del css en el atributo "background" es decir su ruta... les comparto el código en codepen para hacerme entender mejor, dicho código consiste en que hay unas miniaturas que al darles click deben cambiar y remplazar a dos imágenes, una basándose en el mismo atributo src en el html, con la cual lo logro sin problema, pero la otra es la que quiero cambiar por la imagen de la miniatura pero la ruta de esta imagen debe remplazar a la de su background, y no lo he logrado.... de antemano muchas gracias http://codepen.io/EdwingGit/pen/dXNomP
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve

Como cambiar url de un background (css) por la url de un img (en el html) gracias

Publicado por xve (557 intervenciones) el 24/06/2016 19:49:15
Hola Edwing, seria algo así:

1
$("#image").css("background","url(nuevaImagen.png)");
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Edwing

Como cambiar url de un background (css) por la url de un img (en el html) gracias

Publicado por Edwing (11 intervenciones) el 24/06/2016 21:32:38
Hola, gracias, así se hace cuando la imagen es única y le puedes dar la url de la imagen de una vez, si miras en codepen así intente hacerlo pero necesito que esa nueva url se genere de una variable (pues se debe generar al darle click a unas miniaturas que son las que deben aparecer en el background del div)... no se si me hago entender, pero de nuevo muchas gracias :)
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Edwing

Como cambiar url de un background (css) por la url de un img (en el html) gracias

Publicado por Edwing (11 intervenciones) el 24/06/2016 21:43:12
Hola de nuevo, ya encontré como mira, es con la estructura que me indicaste pero generando el valor de la url con una variable asi:
1
2
3
4
$("img").click( function() {
  var src = $(this).attr("src");
  $(".interactivo").css({"background-image":"url('"+src+"')"});
});

Buen día y de nuevo gracias por tu interés...
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
Imágen de perfil de Edwing

Como cambiar url de un background (css) por la url de un img (en el html) gracias

Publicado por Edwing (11 intervenciones) el 25/06/2016 01:36:55
Perdón la ignorancia pero como le doy solucionado al hilo?? jejeje no encuentro como
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de xve

Como cambiar url de un background (css) por la url de un img (en el html) gracias

Publicado por xve (557 intervenciones) el 25/06/2016 08:47:49
Hola Edwin, no hay manera de indicar al hilo que se soluciono el problema... o por lo menos yo no la he encontrado!!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Edwing

Como cambiar url de un background (css) por la url de un img (en el html) gracias

Publicado por Edwing (11 intervenciones) el 26/06/2016 23:57:53
jaja oK... buen día ....
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar