Gracias
Hans el Topo; este es mi último intento porque no quiero molestar más. El código html que utilizo es:
<div class="msg_list">
<p class="msg_head">Header-1 </p>
<div class="msg_body">
orem ipsum dolor sit amet
</div>
<p class="msg_head">Header-2</p>
<div class="msg_body">
orem ipsum dolor sit amet
</div>
<p class="msg_head">Header-3</p>
<div class="msg_body">
orem ipsum dolor sit amet
</div>
</div>
Todo el panel está bajo
msg list, el título bajo
msg head y el panel que quiero que colapse bajo
msg_body. Los atributos CCS de esas tres clases son los siguientes:
p {
padding: 0 0 1em;
}
.msg_list {
margin: 0px;
padding: 0px;
width: 383px;
}
.msg_head {
padding: 5px 10px;
cursor: pointer;
position: relative;
background-color:#FFCCCC;
margin:1px;
}
.msg_body {
padding: 5px 10px 15px;
background-color:#F4F4F8;
}
Y para acabar el código javascript propiamente dicho:
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
//hide the all of the element with class msg_body
$(".msg_body").hide();
//toggle the componenet with class msg_body
$(".msg_head").click(function()
{
$(this).next(".msg_body").slideToggle(600);
});
});
</script>
El problema parece estar en que la palabra class está reservada en IE, cito el artículo de donde saqué la información:
Luego de algunas tazas de café encontré la línea causando el problema:
var class = $(this).parent().attr('class');
Sí, class parece ser una palabra reservada en Internet Explorer, gracias nuevamente Microsoft por hacer la vida de los desarrolladores web tan dificil. Solo tuve que cambiar el nombre de la variable para solucionar el problema, usé algo como esto:
var tabClass = $(this).parent().attr('class');
Un poco después encontré otra referencia al problema de usar class, ¡por un demonio!, ¿y dónde estaba ese artículo cuando estaba buscando la solución? Al parecer tampoco se puede modificar clases usando el método attr() de jQuery en Internet Explorer, bueno, supongo que por eso es que tenemos addClass() y removeClass().
La información técnica sobre el error es esta:
class is a reserved word in Internet Explorer. All versions. All trouble. All the time. The fun part is I knew better than to use class as a variable, rather, I was just using it with jQuery’s attr method. IE says no to $("p").attr({ class : "wheee" });. Probably one of several reasons jQuery includes class specific methods like addClass and removeClass.
He estado cambiando la palabra
class por todo el código, pero no doy con el problema. Se ve que no lo hago bien, porque no se lo que hago e intento a lo bruto. A ver si podéis retocar vosotros lo que veáis mal, o por lo menos confirmarme si voy por buen camino. Creo que hay que cambiar la sintaxis de jscript al standard de jquery, ¿podría ser?... que novato soy.
Por si acaso os pego de nuevo el enlace del ejemplo, que funciona en FF y no en IE:
http://roshanbh.com.np/examples/exapandable-panel/Muchas gracias, de veras. Tenéis una paciencia a prueba de bombas.
Mostrar Mensajes
.
