Hola
pues si no! , sin el codigo como dificil sin embargo el problema radica en que no se ejecuta una funcion javascript en el archivo que se carga desde ajax si lo llamo directamente funciona bien.
El menu es totalmente funcional. pero si cargo las listas desde ajax en un div, no se despliega el efecto pero si se cargan los estilos. lo que quiero es cargar el div
<div id="navBar"> desde ajax.
nota:este cod lo encontre en una web; la he estado buscando y no la encuentro, sin embargo no tenia ninguna nota sobre la licencia.
al archivo pag html le he agragado una funcion asociada al evento onclick para que cargue por medio de ajax el div, creo que no es necesario colocar el cod, los he colocado asi para que le sirvan a otros.
los estilos
Código:
body, input, textarea {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 11px;
}
h1 {font-size: 20px;}
h2 {font-size: 18px;}
h3 {font-size: 14px;}
#navBar {
border: 1px inset #a7a6aa;
width: 150px;
}
#navBar .section {
border: 1px solid #a7a6aa;
}
#navBar .section h3 {
background: #ebe9ed;
color: #000000;
margin:0;
padding: 5px;
cursor: pointer;
font-size: 12px;
text-align: center;
}
#navBar .section .contents {
padding: 5px;
height: 350px;
overflow: auto;
}
acordian.js
Código:
Accordian = Class.create();
Accordian.prototype = {
initialize: function(elem, clickableEntity) {
this.container = $(elem);
var headers = $$('#' + elem + ' .section ' + clickableEntity);
headers.each(function(header) {
Event.observe(header,'click',this.sectionClicked.bindAsEventListener(this));
}.bind(this));
},
sectionClicked: function(event) {
this.openSection(Event.element(event).parentNode);
},
openSection: function(section) {
var section = $(section);
if(section.id != this.currentSection) {
this.closeExistingSection();
this.currentSection = section.id;
var contents = document.getElementsByClassName('contents',section);
contents[0].show();
}
},
closeExistingSection: function() {
if(this.currentSection) {
var contents = document.getElementsByClassName('contents',this.currentSection);
contents[0].hide();
}
}
}
la pagina html
Código:
<html><head><title>Accordian Example Page</title>
<script src="archivos/prototype.js"></script>
<script src="archivos/accordian.js"></script>
<link href="archivos/style.css" rel="stylesheet" type="text/css" > </link>
<script>
Event.observe(window,'load',init,false);
function init() {
accordian = new Accordian('navBar','h3');
}
</script></head><body>
<h1>Accordian Examples</h1>
<div style="float: left;">
<div id="navBar">
<div class="section" id="S_Nav1">
<h3>Nav 1</h3>
<div class="contents" style="display: none;">
Nav section 1
</div>
</div>
<div class="section" id="S_Nav2">
<h3>Nav 2</h3>
<div class="contents" style="display: none;">
Nav section 2
</div>
</div>
<div class="section" id="S_Nav3">
<h3>Nav 3</h3>
<div class="contents" style="display: none;">
Nav section 3
</div>
</div>
</div>
</div>
</body></html>
</body>
</html>
graicas por la ayuda.