mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 29.03.2024 07:03 Benutzername: Passwort: Auto-Login

Thema: Problem mit Jquery Akkordeon Menü vom 25.03.2009


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> Problem mit Jquery Akkordeon Menü
Autor Nachricht
Coobi
Threadersteller

Dabei seit: 25.03.2009
Ort: -
Alter: -
Geschlecht: -
Verfasst Mi 25.03.2009 07:33
Titel

Problem mit Jquery Akkordeon Menü

Antworten mit Zitat Zum Seitenanfang

Hi Leute,

ich verzweifel grad an meinem JQuery Akkordeon Menü. Und zwar hätte ich gerne das mein erster Menüpunkt beim Laden der Seite aufgeklappt ist. Hier ist mal mein Code:

Code:

<script type="text/javascript" src="js/jquery.js"></script>
   <script type="text/javascript" src="js/jquery.easing.js"></script>
   <script type="text/javascript" src="js/jquery.dimensions.js"></script>
   <script type="text/javascript" src="js/jquery.accordion.js"></script>

   <script type="text/javascript">
   jQuery().ready(function(){
   
      jQuery('#navigation').accordion({
         active: false,
         header: '.head',
         navigation: true,
         event: 'mouseover',
         fillSpace: true,
         animated: 'easeslide'
      });   
      
      var wizard = $("#wizard").accordion({
         header: '.title',
         event: false
      });
      
      var wizardButtons = $([]);
      $("div.title", wizard).each(function(index) {
         wizardButtons = wizardButtons.add($(this)
         .next()
         .children(":button")
         .filter(".next, .previous")
         .click(function() {
            wizard.accordion("activate", index + ($(this).is(".next") ? 1 : -1))
         }));
      });
      
      // bind to change event of select to control first and seconds accordion
      // similar to tab's plugin triggerTab(), without an extra method
      var accordions = jQuery('#navigation');
      
      jQuery('#switch select').change(function() {
         accordions.accordion("activate", this.selectedIndex-1 );
      });
      jQuery('#close').click(function() {
         accordions.accordion("activate", -1);
      });
      jQuery('#switch2').change(function() {
         accordions.accordion("activate", this.value);
      });
      jQuery('#enable').click(function() {
         accordions.accordion("enable");
      });
      jQuery('#disable').click(function() {
         accordions.accordion("disable");
      });
      jQuery('#remove').click(function() {
         accordions.accordion("destroy");
         wizardButtons.unbind("click");
      });
   });
   </script>



und hier der Menüaufruf:

Code:

     <div class="menue">
         <ul id="navigation">
            <li>
               <a class="head" href="?p=1.1.1">Menue1</a>
               <ul>
                  <li><a href="?p=1.1.1.1">Über uns</a></li>
                  <li><a href="?p=1.1.1.2">Firmenleitbild</a></li>
                  <li><a href="?p=1.1.1.3">Produkte</a></li>
                  <li><a href="?p=1.1.1.4.1">Schleifmaschinen</a></li>
                  <li><a href="?p=1.1.1.4.2">Service</a></li>
                  <li><a href="?p=1.1.1.4.3">Jobs</a></li>
                  <li><a href="?p=1.1.1.4.4">Kontakt</a></li>
                  <li><a href="?p=1.1.1.5">Impressum</a></li>
               </ul>
            </li>
            <li>
               <a class="head" href="?p=1.1.2">Menue2</a>
               <ul>
                  <li><a href="?p=1.1.2.1">Seite1</a></li>
                  <li><a href="?p=1.1.2.2">Seite2</a></li>
                  <li><a href="?p=1.1.2.3">Seite3</a></li>
                  <li><a href="?p=1.1.2.4">Seite4</a></li>
                  <li><a href="?p=1.1.2.5">Seite5</a></li>
               </ul>
            </li>
            <li>
               <a class="head" href="?p=1.1.3">Menue3</a>
               <ul>
                  <li><a href="?p=1.1.2.1">Seite1</a></li>
                  <li><a href="?p=1.1.2.2">Seite2</a></li>
                  <li><a href="?p=1.1.2.3">Seite3</a></li>
                  <li><a href="?p=1.1.2.4">Seite4</a></li>
                  <li><a href="?p=1.1.2.5">Seite5</a></li>
               </ul>
            </li>
         </ul>
</div>



Wäre toll wenn ihr mir helfen könnt.

Danke.
  View user's profile Private Nachricht senden
fyll

Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht: Männlich
Verfasst Mi 25.03.2009 08:15
Titel

Antworten mit Zitat Zum Seitenanfang

Ich hab jQuery noch nie in der Hand gehabt..
Aber der Seite hier entnehm ich einfach mal, dass es reichen sollte, wenn du noch
Code:
active: '.selected',
selectedClass: 'active',
dazusetzt und unten halt noch <a class="head selected"...> ...*shurg*
  View user's profile Private Nachricht senden
Anzeige
Anzeige
Coobi
Threadersteller

Dabei seit: 25.03.2009
Ort: -
Alter: -
Geschlecht: -
Verfasst Mi 25.03.2009 11:48
Titel

Antworten mit Zitat Zum Seitenanfang

Hallo Ferret,

danke das klappt. Ich habe das total übersehen. Habe mich gestern 3 Stunden damit rumgeärgert.

Nun hätte ich noch eine Frage. Und zwar würde ich das Menü gerne Farblich verändern, das jeder einzelne Menüabschnitt eine andere Farbe bekommt.

Aber das scheitert wohl an dieser Zeile:

Code:
 header: '.head',


Hast du ne Idee wie ich das ändern kann damit ich den Heads verschiedene Farben geben kann ?!

Danke dir.

gruss


Zuletzt bearbeitet von Coobi am Mi 25.03.2009 11:49, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
fyll

Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht: Männlich
Verfasst Mi 25.03.2009 12:04
Titel

Antworten mit Zitat Zum Seitenanfang

Hmm...?! Schau dir halt den Quelltext der Seite an und vergleiche deins mit dem darunterliegenden Beispiel - und deine Vermutung geht schon in die richtige Richtung - ja.
Viel Spaß und so...


Drecks Frameworks, wysiwyg und so Zeug ... echt .... -.- Gehört verboten - oder man sollte ne Benutzungslizenz einführen ^^
  View user's profile Private Nachricht senden
 
Ähnliche Themen jquery slidetoggle menü problem
akkordeon, für das letzte menü optimieren
Problem mit AS3 und Akkordeon
Menü per jquery animieren
Img fade in CSS gestyltem Menü? (jQuery/JS)
jquery Menü funzt nicht in IE6 und 8
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.