jquery ui pestañas no funcionan

Tengo el siguiente script que no funciona. que debería ser el uso de pestañas jQuery, pero los enlaces no están convirtiendo a las pestañas por alguna razón:jquery ui pestañas no funcionan

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Untitled Page</title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 
    <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" /> 

    <script type="text/javascript" language="javascript"> 
     $(document).ready(function(){ 
      $("#tabs").tabs(); 
     }); 
    </script> 

</head> 
<body> 

<div id="tabs"> 
    <ul> 
     <li><a href="#tabs-1">Nunc tincidunt</a></li> 
     <li><a href="#tabs-2">Proin dolor</a></li> 
     <li><a href="#tabs-3">Aenean lacinia</a></li> 
    </ul> 
    <div id="tabs-1"> 
     <p>Proin elit arcu, rutrum commodo, vehicula tempus, commodo a, </p> 
    </div> 
    <div id="tabs-2"> 
     <p>Morbi tincidunt, dui sit amet facilisis feugiat, odio metus </p> 
    </div> 
    <div id="tabs-3"> 
     <p>Mauris eleifend est et turpis. Duis id erat. Suspendisse potenti. </p> 
    </div> 
</div> 
</body> 
</html>

Fuente

2011-03-08 oshirowanen

¿incluyó todos los 'CSS'? – diEcho

Sí, consulte la pregunta editada más arriba. – oshirowanen

Para su documento sobre jsFiddle, es necesario entrar en su página en el formato que espera el violín. Solo el HTML en el panel HTML y solo el JS en el panel de JavaScript. Su HTML solo debe incluir lo que va dentro del elemento del cuerpo. Su JS solo debe incluir lo que va dentro de la etiqueta del script. No debe incluir elementos DOCTYPE, body o html. No debe incluir la etiqueta del script en sí. Vea los documentos aquí: http://doc.jsfiddle.net/basic/introduction.html#entering-code. El código funcionará si haces esto.

Una vez que haya hecho eso, solo necesita incluir/hacer referencia al CSS correcto que crea el estilo y se mostrará como una interfaz con pestañas. Para su documento independiente, esto es todo lo que necesita hacerse.

Fuente

2011-03-08 13:02:36 tvanfosson

El código que ve en la pregunta original es el código que estoy usando en mi servidor personal y no funciona. – oshirowanen

@oshirowanen - eso es porque la URL del CSS es incorrecta. Pruebe http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/smoothness/jquery-ui.css o cualquier otro tema. Consulte http://jsfiddle.net/Cv5AY/7/ Tenga en cuenta que agregué ese archivo CSS como un recurso además de modificar su código para que se ajuste a las reglas de entrada de Fiddle. – tvanfosson

Esto no responde la pregunta del OP. – 8bitjunkie

Respuesta

Cuestiones relacionadas