Foros del Web » Programando para Internet » Javascript » Frameworks JS »

(Consulta) Como mejorar esto?

Estas en el tema de (Consulta) Como mejorar esto? en el foro de Frameworks JS en Foros del Web. Hola a todos, Hice este sencillo codigo para cambiar el atributo src de las imagenes. Como podria mejorarlo, optimizarlo, simplificarlo? @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); Código Javascript : ...
  #1 (permalink)  
Antiguo 17/08/2011, 13:38
 
Fecha de Ingreso: marzo-2008
Mensajes: 1.020
Antigüedad: 12 años, 7 meses
Puntos: 21
(Consulta) Como mejorar esto?

Hola a todos,
Hice este sencillo codigo para cambiar el atributo src de las imagenes.

Como podria mejorarlo, optimizarlo, simplificarlo?

Código Javascript:
Ver original
  1. $(document).ready( function() {
  2.  
  3. var $hipodromo     = "hipodromo";
  4. var $rio           = "rio";
  5. var $catedral      = "catedral";
  6. var $restaurant = "restaurante";
  7. var $comercial     = "zona_comercial";
  8. var $tren         = "tren";
  9. var $salud         = "salud";
  10. var $ruta        = "panamericana";
  11. var $maps         = "mapa";
  12. var $shopping    = "shopping";
  13.  
  14. var $path        = "images/barrio/";
  15. var $ext        = ".jpg";
  16.  
  17. var $img         = "#coleccion img";
  18.  
  19.     $(".opt").click( function() {
  20.        
  21.         if ("#rio") {
  22.             $($img).change().attr({ src: $path + $rio + $ext });
  23.         } else if ("#resto") {
  24.             $($img).change().attr({ src: $path + $restaurant + $ext });
  25.         } else if ("#tren") {
  26.             $($img).change().attr({ src: $path + $tren + $ext });
  27.         } else if ("#ruta") {
  28.             $($img).change().attr({ src: $path + $ruta + $ext });
  29.         } else if ("#shopping") {
  30.             $($img).change().attr({ src: $path + $shopping + $ext });
  31.         } else if ("#hipodromo") {
  32.             $($img).change().attr({ src: $path + $hipodromo + $ext });
  33.         } else if ("#catedral") {
  34.             $($img).change().attr({ src: $path + $catedral + $ext });
  35.         } else if ("#comercial") {
  36.             $($img).change().attr({ src: $path + $comercial + $ext });
  37.         } else if ("#salud") {
  38.             $($img).change().attr({ src: $path + $salud + $ext });
  39.         } else {
  40.             $($img).change().attr({ src: $path + $maps + $ext });
  41.         }
  42.  
  43.     });
  44.  
  45.            
  46. });

Gracias.
__________________
_
  #2 (permalink)  
Antiguo 18/08/2011, 08:27
 
Fecha de Ingreso: marzo-2008
Mensajes: 1.020
Antigüedad: 12 años, 7 meses
Puntos: 21
Respuesta: (Consulta) Como mejorar esto?

Hice estos cambios pero no he logrado que cumpla su objetivo.
Código Javascript:
Ver original
  1. $(document).ready( function() {
  2.  
  3.     var $barrio_path        = "images/barrio/";
  4.  
  5.     var $barrio =  [
  6.             "hipodromo",
  7.             "rio",
  8.             "catedral",
  9.             "restaurante",
  10.             "zona_comercial",
  11.             "tren",
  12.             "salud",
  13.             "panamericana",
  14.             "mapa",
  15.             "shopping"
  16.         ];
  17.  
  18.  
  19.     var $amenity_path = "images/amenity/";
  20.     var $amenity =  [
  21.             "pileta",
  22.             "gim",
  23.             "parque",
  24.             "internet",
  25.             "solarium",
  26.             "microcine",
  27.             "guarderia",
  28.             "seguridad",
  29.             "sum",
  30.             "sauna",
  31.             "parking",
  32.             "tv",
  33.             "laundry",
  34.             "juegos",
  35.             "cocheras",
  36.             "vestuario"
  37.         ];
  38.  
  39.     var $ext        = ".jpg";
  40.     var $img         = "#coleccion img";    
  41.  
  42.  
  43. var $barrio_path  = "images/barrio/";
  44. var $amenity_path = "images/amenity/";
  45.  
  46. var $ext        = ".jpg";
  47. var $img         = "#coleccion img";
  48.  
  49.  
  50.     $(".opt").click( function() {
  51.        
  52.         for(var $i = 0; $i < $barrio.lenght; $i++) {
  53.             if ($barrio[$i]) { $($img).change().attr({ src: $barrio_path + $barrio[$i] + $ext }); }
  54.             break;
  55.         }
  56.        
  57.     });
  58.  
  59.            
  60. });
__________________
_
  #3 (permalink)  
Antiguo 18/08/2011, 08:46
 
Fecha de Ingreso: diciembre-2009
Ubicación: Misiones
Mensajes: 867
Antigüedad: 10 años, 10 meses
Puntos: 65
Respuesta: (Consulta) Como mejorar esto?

podés colocar el nombre como atributo
Código HTML:
Ver original
  1.   <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  2.   <script>
  3.     $( function() {
  4.         $('#opt li').click( function(){
  5.             $('#msg').text('images/barrio/'+$(this).attr('data-opt')+'.jpg');
  6.         });
  7.     });
  8.     </script>
  9.  
  10. </head>
  11.  
  12. <ul id="opt">
  13.     <li data-opt="rio">Opción rio</li>
  14.     <li data-opt="resto">Opción resto</li>
  15.     <li data-opt="tren">Opción tren</li>
  16.     <li data-opt="ruta">Opción ruta</li>
  17.     <li data-opt="shopping">Opción shopping</li>
  18. </ul>
  19. <div id="msg"></div>
  20. </body>
  21. </html>

también podrias recuperar el id si es igual al nombre de la imagen pero no sé si te convendria

Etiquetas: jquery
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 03:01.