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

Ajaxify con map-image

Estas en el tema de Ajaxify con map-image en el foro de Frameworks JS en Foros del Web. Hola buenas noches, tengo un pequeño problema, estoy haciendo una web para mostrar datos. Estoy usando AJAX, especificamente el plugin [URL="http://max.jsrhost.com/ajaxify/"]Ajaxify [/URL] , el cual ...
  #1 (permalink)  
Antiguo 10/07/2011, 20:07
 
Fecha de Ingreso: octubre-2010
Mensajes: 3
Antigüedad: 10 años
Puntos: 0
Pregunta Ajaxify con map-image

Hola buenas noches, tengo un pequeño problema, estoy haciendo una web para mostrar datos. Estoy usando AJAX, especificamente el plugin [URL="http://max.jsrhost.com/ajaxify/"]Ajaxify [/URL] , el cual funciona fantastico. Agregando el script de jquery y el de ajaxify, y agregando una clase al link "ajaxify" y asignando el DIV donde cargar el contenido funciona muy bien.

El problema es que tengo que usar map-image, y a pesar de agregar la clase a <area shape="circle" coords="209,279,8" href="content/sud-america/bolivia.html" class="ajaxify" /> ajaxify no lo reconoce y no me carga el contenido con AJAX. Supongo que es porque ajaxify solo reconoce la clase en un link del tipo <a href="..." class="ajaxify">.....</a>.

Como puedo hacer, a traves de javascript, para que un elemento <area shape="circle" coords="209,279,8" href="content/sud-america/bolivia.html" class="ajaxify" /> sea reconocido por ajaxify como un link.

Agrego mi código. Quiero suponer que es bastante facil, pero no tengo conocimiento de javascript. Agradeceria mucho cualquier tipo de ayuda!!!!

Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
<meta http-equiv="Content-type" content="text/html; charset=utf-8" /> 
<title>América y los Sistemas de Seguridad Social</title> 
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" title="no title" charset="utf-8"> 
<!--AJAX-->
<script type="text/javascript" src="js/ajax/jquery.min.js"></script>
<script type="text/javascript" src="js/ajax/jquery.ajaxify.js"></script>
<script type="text/javascript">
$(document).ready(function() {  
   $('.ajaxify').ajaxify({
        animateOut:{opacity:'0'},
        animateOutSpeed:600,
        animateIn:{opacity:'1'},
        animateInSpeed:600,
        loading_target:'#container'
});
   }); 
</script>
</head> 
<body> 
    <div id="wrapper"> 
    
        <div id="menu"> 
            <div class="nav_1">
            	<a href="index.html">Home</a>
                <a href="content/norte-america/map.html" class="ajaxify">Norte América</a>
                <a href="content/centro-america/map.html" class="ajaxify">Centro América y el Caribe</a>
                <a href="content/sud-america/map.html" class="ajaxify">Sud América</a>  
             </div>
             <div class="app_title">América y los sistemas de Seguridad social</div>
      </div> 	
      <div id="container">                
                  	<h2>América</h2> 
                    <div id="mapa_img" style="float:left;"><img src="images/america.png" height="400" usemap="#Map" />
                    
                      <map name="Map" id="Map">                        
                        <area shape="circle" coords="209,279,8" href="content/sud-america/bolivia.html"  class="ajaxify" />
                        <area shape="circle" coords="183,263,8" href="content/sud-america/peru.html"   class="ajaxify" />
                        <area shape="circle" coords="255,264,8" href="content/sud-america/brasil.html"  class="ajaxify" />
                      </map>
                      </div>
                   <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
      </div> 

    </div> 
</body> 
</html>

Etiquetas: ajax, contenido, 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 16:23.