Estaba tan feliz haciendo mi menú desplegable y probándolo en Firefox que funcionaba perfectamente. Pero al probarlo en:
- Chrome: no funcionan los links
- Opera: tampoco
- Safari: funciona pero incompleto
La página principal (index.html) tiene lo típico, el menú y una sección con un saluda.
Teóricamente cuando se pulsa sobre algún elemento del menú hace un load de otra página y la vuelca en la sección de la página principal. (Lo hago así para evitarme frames o iframes de tan mala fama, pero ese no es el tema).
Chrome en el inspector da el siguiente mensaje:
jquery-3.1.1.min.js:4 XMLHttpRequest cannot load file:///Volumes/NIKI/aweb/japan1/orientales.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
send @ jquery-3.1.1.min.js:4
r.extend.ajax @ jquery-3.1.1.min.js:4
r.fn.load @ jquery-3.1.1.min.js:4
(anonymous function) @ escripes.js:38
r.event.dispatch @ jquery-3.1.1.min.js:3
q.handle @ jquery-3.1.1.min.js:3
Por si sirve de algo.
El script (previo document.ready) es este:
Código:
El código html es:function navegacion(){
$('.trescols a').click(function(e){
e.preventDefault();
var link = $(this).attr('href');
$('section').load(link);
});
$('#menu a').click(function(e){
e.preventDefault();
var link = $(this).attr('href');
$('section').load(link); esta es la línea 38
});
}
Código:
He probado en el script no llamar sólo con section, he probado ponerle un id a section, llamar $('#contenedor section') y nada.<body> <div id="contenedor"> <header> <-- aquí el menu--> </header> <section> <p>Bienvenido</p> </section> </div> </body>
Alguna idea de cuál es el problema.
