Ergebnis 1 bis 4 von 4

Thema: accordion selbstbau

  1. #1
    Azubi(ne)
    Registriert seit
    20.11.2008
    Beiträge
    68
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard accordion selbstbau

    hi,
    vielleicht kann mir jemand weiter helfen und verraten wie ich die scripts richtig zusammen baue
    danke.

    Code:
    $('h1 > a').bind('click', function(event){
        event.preventDefault();
    
    
    })
    
    
    
    
        var accordion_id = "currentTarget.html";
        var Suche = accordion_id.indexOf(".html");
        var Teil = Suche.substring(0, 5);
        alert(Teil);
        
        
    box=$('#extendbox_'+shorturl)
    
    if{box.hasClass("closed")){
            slideDown("fast");
            removeClass('closed');
    }else{
        slideUp("fast");
        addClass('closed');
    }
    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
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: accordion selbst bau

    gib ma den entsprechenden html-code dazu und erklär mal schritt für schritt, was dein script macht.
    hab die vermutung so isses sinnvoller, als wenn ich dir ne fertige lösung präsentier
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

  3. #3
    Azubi(ne)
    Themenstarter

    Registriert seit
    20.11.2008
    Beiträge
    68
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: accordion selbst bau

    ja wahrscheinlich
    das scrippt soll von dem anker in h1 bei klick das div mit der jeweiligen id öffnen bzw schließen. dazu muss aus dem link alles weggekürz werden außer dem entsprechendem ziel also in demfall prdodukt. dann wird produkt zusammen gesetzt zu einer id und soll dann geöffnet werden.
    HTML-Code:
    <h1><a href="produkte.html">Produkte<span> im Shop</span></a></h1>
            <div class="box">
                <div class="exhibit">
                    <h2>Überschrift</h2>
                    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dap</p>
                    <img src="files/content_01.jpg">
                </div>
                <div class="exhibitor">
                    <img src="files/designer_01.jpg">
                    <h2>Lorem</h2>
                    <p>Lorem Ipsum</p>
                </div>
            </div>
            <div class="box closed" id="extendbox_produkte">
                <div class="exhibit">
                    <h2>Überschrift</h2>
                    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum. Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc, </p>
                    <img src="files/content_02.jpg">
                </div>
                <div class="exhibitor">
                    <img src="files/designer_02.jpg">
                    <h2>Lorem</h2>
                    <p>Lorem Ipsum</p>
                </div>
            </div>
    Geändert von guuls (12.08.2011 um 10:21 Uhr)

  4. #4
    Forum Guru Avatar von synaptic
    Registriert seit
    20.06.2007
    Ort
    Butzbach-Wiesental
    Beiträge
    10.901
    Danke
    45
    Bekam 48 mal "Danke" in 46 Postings
    Blog-Einträge
    1

    Standard AW: accordion selbst bau

    also als erstes arbeite mit anständigen IDs und klassen (am besten für css und js eigene und die js-actions mit js_ beginnen, das mach den code übersichtlicher für debugs)
    dann würde ich wenn ich was mit links machen möchte und werte "sichern" oder initial verfügbar haben will das REL-attribut nutzen dafür.

    also schreib die ID der zu öffnenden box is rel-attr, da ersparste dir so substring-dinger.

    zu deinem script:

    var accordion_id = "currentTarget.html";

    hier wird ja nichts dynamisch erkannt...

    klick auf a-tag=>function die rel ausliest, box-id aus rel baut, prüft ob element closed als class hat
    ja dann slideDown und closed wegnehmen, nein dann slideUP und close setzen
    return false am ende und gut is.
    du musst da kein event und prevent default haben wenn du false zurückgibst
    KEIN support via pn, email, messenger oder falsch geposteten threads
    Futter für deine Schnuffelzwerge gibts bei den Schnuffelzwergen TOP Qualität, also klicken und kaufen

Ähnliche Themen

  1. Accordion - die Zweite
    Von micronix im Forum HTML & CSS Forum
    Antworten: 1
    Letzter Beitrag: 26.05.2010, 17:44
  2. Accordion
    Von micronix im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 26.05.2010, 16:15
  3. iframe in Accordion
    Von enorute.outbound im Forum HTML & CSS Forum
    Antworten: 7
    Letzter Beitrag: 22.02.2010, 21:30
  4. Spry Accordion
    Von basu im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 1
    Letzter Beitrag: 31.08.2009, 16:48

Stichworte

Berechtigungen

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