Ich versuche, jquery ui (Akkordeon) in einem AnythingSlider Panel zu verwenden und es funktioniert nicht - jemand schaut?

Question

Ich mache eine Website von AnythingSlider und möchte die Akkordeon-Funktion von jQuery UI in einem Panel verwenden und die ganze Seite kackt das Bett. Alle Verweise auf js und css funktionieren. Und nun die Nachrichten ...

<script type="text/javascript"> 
    // Set up Sliders 
    // ************** 
    $(function(){ 
    $('#slider').anythingSlider({ 
    startPanel    : 1, 
    buildArrows  : false, 
    autoPlay    : false, 
    width     : 600, // if resizeContent is false, this is the default width if panel size is not defined 
    height     : 350, // if resizeContent is false, this is the default height if panel size is not defined 
    resizeContents  : false, // If true, solitary images/objects in the panel will expand to fit the viewport 
    startStopped   : true, // If autoPlay is on, this can force it to start stopped 
    navigationFormatter : function(index, panel){ // Format navigation labels with text 
    return ['home', 'menu', 'find us', 'order online', 'cater', 'contact'][index - 1]; 
    } 
    }); 

    $("#accordion").accordion({ header: "h3" }); 

    }); 
</script> 

und im Körper:

<li class="panel2"> 

    <div id="accordion"> 
    <div> 
    <h3><a href="#">First</a></h3> 
    <div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div> 
    </div> 
    <div> 
    <h3><a href="#">Second</a></h3> 
    <div>Phasellus mattis tincidunt nibh.</div> 
    </div> 
    <div> 
    <h3><a href="#">Third</a></h3> 
    <div>Nam dui erat, auctor a, dignissim quis.</div> 
    </div> 
    </div> 
    </li> 

Answer 1

Was fehlt, ist eine CSS-Definition Ihrer panel2 Höhe einzustellen. Weil es anfangs nur eine Liste ist, ist die Höhe viel kleiner. Aber wenn Sie es in ein Akkordeon umwandeln, wächst die Höhe. Ich kann nicht von einer einfacheren Methode denken, so wahrscheinlich ist es am besten, die Höhe, um herauszufinden, Sie wollen:

.panel2 { height: 350px; } 

Hier ist ein demo.

Beachten Sie auch, wenn ich in der Demo resizeContents: true setze, brauche ich nicht oben das CSS-Bit.

Answer 2

Mein dummes, dummes schlechtes. Es klappt. Ich habe es versäumt, etwas durch Kopieren und Einfügen in ein neues Dokument hinzuzufügen. Wenn Sie interessiert sind: http://bigsilkdesign.com/mercado/

Vielen Dank für Ihre Antwort. Dafür bekommst du eins. Nicht so, wie du es brauchst, sondern Kredit, wenn fällig.

Wenn für nichts anderes zu meiner veränderten Nutzung von AnythingSlider zu sehen ...