Ergebnis 1 bis 5 von 5

Thema: Für Euch bestimmt ein "Klacks"...bitte helft mir

  1. #1
    HTML Newbie
    Registriert seit
    07.04.2014
    Beiträge
    3
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Für Euch bestimmt ein "Klacks"...bitte helft mir

    Hallo liebe leute...

    Bin neu hier und um gleich mal ehrlich zu sein hab ich kaum Ahnung.

    Habe nach einigem Suche den Code für ein Akkordeon bekommen, habe allerdings ein letztes Anpassungsproblem und hoffe Ihr könnt mir helfen !?

    Ich möchte einfach erreichen das immer nur ein teil des Akkordeons offen ist.
    Also wenn ich eins anklicke und es sich öffnet....und ich dann das nächste anklicke zum öffnen soll sich das erste schliessen.
    Ich hoffe ich konnte hier erklären was ich meine und bitte euch höflich um Hilfe.
    Für Euch bestimmt pille palle aber mir würde es sehr helfen...

    Vielen Dank schonmal

    hier der code

    <style type="text/css">
    <!--

    /* Hier die Breite anpassen */
    #akkordeon {
    width: 500px;
    overflow: hidden; }

    /* Aussehen Titel */
    #akkordeon h2 {
    font-size: 14px;
    color: #ffffff;
    background: url(http://img.webme.com/pic/f/find-templates/rechts.png) no-repeat right; }

    /* Feld um Titel */
    .thema {
    cursor: pointer;
    padding: 5px 10px 5px;
    margin-bottom: 5px;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out; }

    /* ausklappbare Feld mit Inhalt */
    #akkordeon .inhalt {
    display: none;
    background-color: #ffffff;
    padding: 15px;
    margin-bottom: 5px;
    overflow: hidden;
    border: 1px solid #c9c9c9; }

    /* Farbe Titelfeld wenn ausgeklappt */
    #akkordeon .open { background-color: #6ca02f!important; }

    /* Grafik rechts wenn ausgeklappt */
    #akkordeon .open h2 {
    background: url(http://img.webme.com/pic/f/find-templates/unten.png) no-repeat right; }

    -->
    </style>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
    <script>
    $(document).ready(function() {

    $('.top .thema').click(function(){

    if($(this).hasClass('closed')) {
    $(this).addClass('open').removeClass('closed');
    $(this).siblings('.inhalt').slideDown(200);
    } else {
    $(this).addClass('closed').removeClass('open');
    $(this).siblings('.inhalt').slideUp(200);
    }
    });

    });

    </script>

    <div id="akkordeon">

    <div class="top">
    <div class="thema closed" style="background: #003030;"> <h2>Hier Titel 1</h2> </div>
    <div class="inhalt"> Hier Inhalt 1 einfügen </div>
    </div>

    <div class="top">
    <div class="thema closed" style="background: #FFA500;"> <h2>Hier Titel 2</h2> </div>
    <div class="inhalt"> Hier Inhalt 2 einfügen </div>
    </div>

    <div class="top">
    <div class="thema closed" style="background: #A52A2A;"> <h2>Hier Titel 3</h2> </div>
    <div class="inhalt"> Hier Inhalt 3 einfügen </div>
    </div>

    <div class="top">
    <div class="thema closed" style="background: #202020;"> <h2>Hier Titel 4</h2> </div>
    <div class="inhalt"> Hier Inhalt 4 einfügen </div>
    </div>

    </div>
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Prinz(essin)
    Registriert seit
    26.03.2013
    Beiträge
    835
    Danke
    20
    Bekam 76 mal "Danke" in 75 Postings

    Standard AW: Für Euch bestimmt ein "Klacks"...bitte helft mir

    Zitat Zitat von Hr-Vorragend Beitrag anzeigen
    Bin neu hier und um gleich mal ehrlich zu sein hab ich kaum Ahnung.
    Dann wird es Zeit das du daran was änderst Hier mal ein Beispiel ohne jQuery -->http://media02.hongkiat.com/css-base...emo/index.html

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    07.04.2014
    Beiträge
    3
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Für Euch bestimmt ein "Klacks"...bitte helft mir

    Danke für die schnelle Antwort und das Beispiel....
    Dein Beispiel hat ja genau die Funktion die ich suche...
    Allerdings ist der Aufbau anders und ich kann mir nicht erklären wie und wo ich Farben anpassen kann.
    Und bevor ich mir da lange erklären lassen oder euch hier nerve bitte ich höflich darum
    mir meinen Code zu vervollständigen um umzusetzen das immer nur eine Spalte geöffnet ist.

    Oder gibt es einen bestimmten Grund dafür ohne jQuery zu arbeiten?
    Vielen lieben Dank

  4. #4
    Prinz(essin)
    Registriert seit
    26.03.2013
    Beiträge
    835
    Danke
    20
    Bekam 76 mal "Danke" in 75 Postings

    Standard AW: Für Euch bestimmt ein "Klacks"...bitte helft mir

    Ohne das was lernst wird das nichts. Wenn du eine Fertiglösung willst, dann poste im Jobforum --> http://www.forum-hilfe.de/forums/53-...-und-Webmaster

    Vorteil ohne jQuery ist halt, dass es immer funktioniert auch wenn Javascript ausgeschaltet ist.

  5. #5
    HTML Newbie
    Themenstarter

    Registriert seit
    07.04.2014
    Beiträge
    3
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Für Euch bestimmt ein "Klacks"...bitte helft mir

    Hallo,

    erstmal nochmal danke für den Tipp zwecks jQuery..

    Ich bin niht an einer Fertiglösung interessiert.
    Mein kleines aber feines Akkordeon ist ja fertig...nur leider fehlt diese eine Funktion
    Ich denke man muss nur eine zeile einfügen...nur leider weiss ich nicht welche und wo...

    Kannst du mir bitte helfen !?

    Vielen vielen dank schon mal

Ähnliche Themen

  1. Bitte um Hilfe beim coden eines "Telefonbuches"
    Von im Forum Forum für alle anderen Programmiersprachen
    Antworten: 4
    Letzter Beitrag: 17.03.2008, 14:29
  2. einfache Linkklasse--> für euch bestimmt! Kostet euch 1 M
    Von Big Stick im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 16.11.2006, 09:44
  3. php: "bitte warten" oder "login läuft"
    Von phore im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 3
    Letzter Beitrag: 05.04.2006, 18:18
  4. Für die Profis sicher "ein Klacks"... für mich: ei
    Von Eulenspiegel im Forum HTML & CSS Forum
    Antworten: 5
    Letzter Beitrag: 05.08.2004, 16:13
  5. Bitte hier lesen bevor eine "Hilfe"-Anfrage
    Von umbenannt im Forum Forum-Hilfe.de intern
    Antworten: 0
    Letzter Beitrag: 29.02.2004, 16:06

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •