Accordion Box 1
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
Accordion Box 2
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Accordion Box 3
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Accordion Box 4
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
tumblr says: 04.08.2020
i am writer and writes many topic about business finance read more click here
ifisa says: 25.07.2020
jquery is very interesting language one of my friend he is working on jquery this time he was make a business website.
Isfia says: 25.07.2020
jquery is very interesting language one of my friend he is working on jquery this time he was make a business website with the help of this language.
uk VoIP Provider says: 24.07.2020
Before telling you the most important topic that is under consideration nowadays I just want to mention to you that this blog is remarkable to describe the various aspects of electric skateboards. Thank you for sharing your views.
website says: 09.07.2020
I have read so many articles or reviews on the topic of the blogger lovers except this
post is truly a good post, keep it up.
james says: 27.06.2020
nice post i really liked it.. this is very informative article.
It’s very informative and you are obviously very knowledgeable in this area.I personally like your post; you have shared good insights and experiences.
varun says: 27.06.2020
Really like your web sites details! Undoubtedly a wonderful provide of knowledge that’s extremely helpful. Stick with it to carry publishing and i’m gonna proceed studying by way of! Cheers.
light says: 18.05.2020
My relatives all the time say that I am killing my time here at web, except I
know I am getting familiarity everyday by reading such pleasant content.
light says: 18.05.2020
If some one wishes expert view on the topic of blogging
and site-building then i suggest him/her to pay a visit this web
site, Keep up the nice job.
light says: 18.05.2020
I used to be recommended this website via my cousin. I’m no
longer sure whether this post is written by way of him as no one else
recognize such precise about my trouble. You’re incredible!
Thank you!
light says: 18.05.2020
I am actually happy to glance at this webpage posts which consists of plenty of useful information, thanks for providing these information.
light says: 18.05.2020
I do not even understand how I stopped up here, but I thought this publish was great.
I don’t recognize who you are but certainly you are going to a
famous blogger should you are not already. Cheers!
light says: 18.05.2020
Awesome blog! Do you have any suggestions for aspiring writers?
I’m planning to start my own site soon but I’m a little lost on everything.
Would you suggest starting with a free platform like WordPress or go for a paid
option? There are so many choices out there that I’m totally
overwhelmed .. Any tips? Thanks!
light says: 18.05.2020
What i do not understood is in fact how you’re not really a lot more neatly-appreciated than you may be
now. You are very intelligent. You recognize therefore considerably relating to this
topic, produced me for my part imagine it from a lot of varied angles.
Its like women and men are not fascinated except it’s one thing to do with Lady gaga!
Your individual stuffs nice. At all times handle it up!
light says: 18.05.2020
It’s genuinely very complex in this busy life to listen news on TV, thus I just use web for that
purpose, and take the most recent news.
Hair design in San Bernardino says: 27.02.2020
certainly like your web-site but you need to check the spelling
on several of your posts. Many of them are rife with spelling issues and I in finding it
very troublesome to tell the truth nevertheless I will definitely come back again.
Buy flats in Hubli says: 25.02.2020
I think that is one of the such a lot important information for me.
And i’m happy studying your article. But want to remark on few basic issues, The
web site taste is ideal, the articles is actually nice :
D. Just right process, cheers
Physicians in Hempstead NY says: 23.02.2020
This is the right blog for anybody who would
like to find out about this topic. You understand a whole lot its
almost hard to argue with you (not that I really will
need to…HaHa). You definitely put a fresh spin on a topic that’s
been discussed for a long time. Excellent stuff, just wonderful!
כיסא זול באלי אקספרס says: 15.02.2020
Hey There. I found your blog the usage of msn. This is a really smartly written article.
I will make sure to bookmark it and come back to learn extra of your
helpful information. Thank you for the post. I will certainly comeback.
keto meals says: 15.02.2020
Right away I am going to do my breakfast, later than having my breakfast coming over again to read additional
news.
guest blogging website says: 06.02.2020
Hi there, after reading this awesome article i am also cheerful to share my experience here with friends.
mia khalifa body size says: 06.02.2020
mia khalifa body size…
blog topic…
Schlafzimmerleuchten says: 25.10.2019
Schlafzimmerleuchten…
Simple jQuery Accordion – Norman's Blog – Demos…
nembutal says: 08.09.2019
nembutal…
Simple jQuery Accordion – Norman's Blog – Demos…
maquiagem para casamento a noite como fazer says: 19.05.2019
Batom escuro = olhos esfumados (levemente marcados).
sewa mobil palembang says: 14.05.2019
I have recently started a website, the info you offer on this site has helped me tremendously. Thanks for all of your time & work. “Cultivation to the mind is as necessary as food to the body.” by Marcus Tullius Cicero.
pulseira pandora couro Verde says: 04.04.2019
whoah this weblog is fantastic i love studying your
posts. Keep up the good work! You realize, a lot of individuals are searching around
for this info, you can aid them greatly.
biz rich world revolution says: 26.03.2019
What’s up, I wish for to subscribe for this website
to obtain most up-to-date updates, so where can i do it please help
out.
queima de 48 horas says: 03.02.2019
Vinícius Possebon é fundador do Q48 horas.
plano detox says: 09.12.2018
Aw, this was an incredibly good post. Taking the time and
actual effort to generate a really good article… but what can I say… I hesitate a whole lot and don’t seem to get anything done.
Mary says: 11.10.2018
Hello mates, its impressive post concerning teachingand fully defined, keep it up all the time.
kobani says: 21.07.2018
I have been exploring for a bit for any high-quality articles or weblog posts
on this sort of area . Exploring in Yahoo I finally stumbled upon this site.
Reading this info So i am happy to express that I have an incredibly good
uncanny feeling I came upon exactly what I needed.
I such a lot without a doubt will make certain to do not put out of your mind this website
and provides it a glance on a constant basis.
https://sieuthinhadathanoi.info/ says: 23.12.2017
Many of these the situation is fairly easy and a lot self respecting men available are
not shy to tackle a diy project, provided that it is of their comfortable zone or
at best inside their level of ability, no sense in embarrassing yourself
and upsetting your wife all in the same day. Concrete driveways will also be good insulators, so heat energy is
a lot more easily stored into concrete. Adding design could be quickly completed with paint jobs and permits you to custom decorate any room.
https://tintucbatdongsan24h.info says: 23.12.2017
The convenience and savings abound for travelers wanting to
get the best of all possible worlds when scouting for a location to stay.
When most people have to visit the first place they think about when it comes to getting an area
to stay at is often a hotel rather than a service apartment that is certainly mostly because they are
not really alert to what a service apartment is.
If you want a location less populated, where you are better the numerous
recreational use spots, you could possibly select the suburbs.
https://sieuthichungcumoi24h.info/ says: 06.12.2017
Most boundary disputes should be handled privately and reach
a contract both sides are satisfied with. Ademption defined
- Ademption occurs when the house the Will leaves to someone is not inside
decedent’s estate in the event the decedent dies. Hope it helps you and you are able to avoid any type of future
problems.
Criar Loja virtual hinode says: 31.07.2017
I’m impressed, I must say. Seldom do I come across a blog
that’s equally educative and engaging, and let me tell you, you have hit the
nail on the head. The issue is an issue that too few people are
speaking intelligently about. I’m very happy that I found this during my
search for something relating to this.
Society For Acupuncture Research - Home says: 02.09.2016
Relieves discomfort and improves function for some folks
with osteoarthritis of the knee and complements common health-related care.
Kapsul Jamu Pelangsing says: 30.05.2017
yes setuju
cellfoods.net says: 06.04.2016
Everything is very open with a clear explanation of the challenges.
It was really informative. Your site is useful.
Thanks for sharing!
Vinny says: 09.08.2016
Gee wiielklrs, that’s such a great post!
Candy says: 04.12.2015
What’s Taking place i am new to this, I stumbled upon this I’ve found It absolutely helpful and it has
aided me out loads. I am hoping to give a contribution &
aid other users like its helped me. Great job.
kapsul jamu pelangsing says: 19.11.2015
Weight Loss Herbal Tea – for Weight Loss – Healthmeup.
Agentur Webdesign says: 12.11.2015
Schönen Effekt. Wir verwenden diese Funktion, wenn die Seite, die Sie brauchen, um eine Menge Text zu platzieren, aber das Design erlaubt es nicht schön zu machen
sreelal says: 03.09.2014
Hi Norman,
This Accordion is good and usefull …
thaks..
Klaus says: 25.02.2014
Hallo Norman,
vielen Dank für die ausführliche Erklärung. Ist zwar schon ein älterer Artikel zum Accordion, aber ich konnte es heute sehr gut gebrauchen. Wirklich simpel und einfach zu implementieren.
.
Sieht fantastisch aus und funktioniert mit der JQuery-Bilbliothek 1.11 sogar im IE
Michael Bohn says: 02.11.2012
Nochmal ich.
Hab’s gerade herausgefunden wie es geht.
War mal wieder einfacher wie gedacht.
Übrigens ein super Feature.
So simple und funktional, wie man sich’s wünscht.
(Link zur Seite: http://www.playduply.de/c_create_own_duply.php)
Weiter so!
Michael Bohn says: 02.11.2012
Hallo Norman.
Kann man das Ganze auch so beim Aufruf der Seite einrichten, dass keine Inhalte, sondern nur die Headlines zu sehen sind?
Ich hab’s mit einigen Einstellungen probiert. Leider ohne Erfolg.
Volker says: 23.06.2012
hmm, also ich lese jetzt seit über einer stunde alle mögelichen seiten über accordion und finde ums verrec… keine funktionierende möglichkeit auf ein beliebiges event (is ja egal was) alle segmente eines accordions zu schliesen.
wenn ich $(‘#portfordion’).accordion(“activate” , 1 ); mache dann schliesst er mir das 2te element wenn dieses offen ist aber eben nicht wenn zufällig das dritte offen ist. -> hatte was gelesen mit $(‘#portfordion’).accordion(“activate” , -1 ); -> aber da passiert nix bei mir.
müsste doch eigneich was ganz einfaches sein ?
würde auch funzen wenn ich auslesen könnte welches segment meines accordions grad offen ist -> dann würds ja mit dem $(‘#portfordion’).accordion(“activate” , variabledesausgelesenenindex ); auch funzen -> aber auch eine solche einfache option hab ich nirgends gefunden.
thx a lot!!
Volker says: 23.06.2012
hello
also da ihr es hier über ruckler habt, ich hätte da auch einen kleinen winzigen an dem ich auch schon sehr lange sass und der aber auch nur unter safarie und chrome kommt. -> firefox ist bombenstabil
is sonst ne schöne seite geworden -> falls jemand lust hat draufzukucken:
http://andre-noll.de/preview/
werd ich wohl dieses we noch veröffentlichen
Monika says: 07.06.2012
@Norman,
auch ich mag mich für dieses einfache und so verdammt gute Script bedanken => ich schätze daran, dass der Inhalt bei deaktiviertem JS einfach da ist
und mag folgendes erzählen:
es ruckelte beim Aufklappen ….
bis ich nach gut 35Minuten erkannte => dieses Ruckeln ist der Scrollbalken der entsteht oder verschwindet,
frau sollte abends nichts mehr arbeiten, aber dies juckte mich einfach
Christian says: 22.03.2012
Toller Beitrag. Kann nicht schaden, sich mit dem Thema detailierter auseinander zusetzen. Werde bestimmt auch die weiteren Posts im Auge behalten.
Holger says: 14.02.2012
Danke für die Anleitung.
Es funktioniert prima!
James says: 06.02.2012
Sorry, ich habe den kompletten Code übernommen, wie er geschrieben ist.
Doch er springt immer noch.
Der Code stimmt nicht.
Was mache ich falsch?
Habe es im Dreamweaver tausend mal ausprobiert.
Habe versucht padding zu verringern, margin rauszunehmen, aber es ändert sich nix.
Ob ich deinen “OrginalCode” nehme oder deinen abändere, es zeigen sich keine unterschiede.
Über Hilfe würde ich mich sehr freuen
LG
Ein User der Hilfe braucht
Norman says: 09.02.2012
Hallo James,
wichtig ist, dass du den Containern eine feste Breite per CSS verpasst, steht auch weiter oben schonmal. Viel Glück!
Fidelia says: 09.08.2016
It’s great to read something that’s both enjoyable and provides prgaamtisdc solutions.
http://gotourl.pw/icicibank.com says: 07.09.2016
MONTILLA SE LLAMABA MACUTO CANTABA LOBA HERIDA SE RECUERDAN … Mas tu cariño no está junto a mÃ, de ti distante no puedo existir. Aullo en las noches, sin ti no hay vida y tú sin mi amor eres loba herida … JAJAJA AHI LA TIENEN
http://www./ says: 01.03.2017
That’s way the bestest answer so far!
driving without a license plate says: 07.03.2017
An interesting discussion will be couturier statement. I cerebrate that you need to write more on this content, it durability not be a preconception concept but mostly everyone is not sufficiency to be able to communicate in such subjects. To the succeeding. Cheers just like your Khmer Karaoke Stars.
Norman says: 09.01.2012
hallo Tom,
das hier ist ein eher simples Accordion, dass solche Funktionen nicht beherrscht. Ich bin mir aber ziemlich sicher, dass das möglich ist, was du beschreibst. z.B könnte das http://jqueryui.com/demos/accordion/#default im Zusammenhang mit dem http://www.jessenicola.com/blog/jquery-accordion-open-outside-link funktionieren, ich würde vorschlagen, du probierst es mal aus und lässt uns wissen, obs funktioniert hat
Tom says: 09.01.2012
Ist es eigentlich möglich innerhalt eines Accordions zu verweisen? z.B ich hab im ersten Accordion einen link der auf das dritte accordion verweist. Bei einem klick darauf soll sie dann das dritte accordion öffnen.
griß tom
Sebastian says: 05.07.2011
Ich würde an deiner Stelle noch ein “.stop(false,true)” hinzufügen, da die Animation mit mehrmaligem Klicken einen loop hat
Sieht schöner aus, wenn es nicht als hin und her springt
Jan says: 04.07.2011
Oh, sorry das ganze sollte eigentlich eine Tabelle werden…
Also “text 1″ ist ein td, welches den trigger enthält und “versteckter Inhalt” liegt in einem div in einer td der nächsten Zeile, der eingeblendet werden soll.
Das Ganze wiederholt sich dutzende Male.
Jan says: 04.07.2011
Hallo Norman,
danke für dieses Superscript!
Habe nun aber folgendes Problem:
In meinem Fall habe ich in einer Tabelle den trigger und der toggle_container liegt ein paar Elemente weiter:
text 1
text 2
Versteckter Inhalt
etc…
Hast Du da einen Vorschlag
majesco says: 23.12.2010
Hallo zusammen,
ich setze das Script auf einer Kundenseite ein und möchte nun den ersten Container beim Aufruf der Seite aufgeklappt haben.
Dazu habe ich folgendes probiert:
1.
Im ersten Container style=”display: block” geschrieben.
Ergebnis: es passiert nichts.
2.
Im Script zwei Zeilen ergänzt und im ersten Container die entsprechende id
$(‘.toggle_container’).hide();
$(‘#firstslider’).slideToggle(‘slow’);
$(‘#firstslider’).addClass(‘trigger_active’);
3.
Im Script zwei Zeilen ergänzt und im ersten Container die entsprechende class
$(‘.toggle_container’).hide();
$(‘.firstslider’).slideToggle(‘slow’);
$(‘.firstslider’).addClass(‘trigger_active’);
Bei 2. und 3. ist der erste Container zwar aufegklappt, verhält sich dann aber unabhängig von den andern. D.h. eine Klick auf die nächste Headline, fährt den entsprechenden Container aus, aber nicht den ersten ein.
Wie kriege ich das hn?
Viele Grüße
majesco
Norman says: 25.12.2010
Hi majesco,
ich bin mir ziemlich sicher, dass diese Frage schon einmal im dazugehörigen Artikel in meinem Blog gestellt wurde. Schau da einfach nochmal nach
Ingo says: 19.12.2010
Hi
Das is genau das was ich suche. Nur habe ich 0,0% Ahnung.
Ich habe auf meiner Website einige Seiten welchen einen extrem langen Text enthalten. Diese langen Texte haben aber Abschnitte und die würde ich gerne so zum auf / zuklappen machen.
Sprich: Ich geh im Adminbereich auf Seiten, erstelle eine und dort wo man über den TinyMCE den Inhalt der Seite eingibt, da möchte ich sowas haben. Das Teile des Inhaltes klappbar sind.
Wie kann ich sowas realisieren?
Norman says: 25.12.2010
Hallo Ingo,
das in den Comments zu klären ist wenig sinnvoll.. da du “0,0% Ahnung” hast, wird es generell schwierig werden. Wenn sich für deine Seite kein WordPress Theme finden lässt, solltest du eventuell überlegen, ob es nicht mehr Sinn macht jemanden dafür zu bezahlen.
therealAnodyne says: 03.12.2010
@Norman
Nö, geht nicht in Firefox und nicht in Chrome (Iron), andere Browser habe ich gerade keine Zeit zu testen.
Will sagen kurz bevor ein Container völlig geöffnet ist, springt er.
Schau noch’mal genau
therealAnodyne
Nachtrag:
Vor allem in Box 2 …
Norman says: 03.12.2010
so habs jetzt angepasst, zufrieden?
therealAnodyne says: 16.01.2011
Jetzt erst gesehen, klar, geht doch
Viel Erfolg weiterhin,
therealAnodyne
Onas says: 16.11.2010
Hey Norman,
danke für diesen Beitrag. Habe schon lange eine ein/ausklappmethode gesucht.
[Allgemein] Ein/Ausklappen says: 11.10.2010
[...] [...]
therealAnodyne says: 25.09.2010
Hallo.
Das Springen wird um so doller um so mehr padding man oben und / oder unten angegeben hat. Da bei dem Effekt die Höhe des Containers animiert wird, wirkt sich dies, da jquery das padding erst am Schluß der Animation addiert, negativ aus (eigentlich ein Bug).
Man kann das beheben, indem man dem animierten Container
1. eine feste Breite verpasst und
2. weder padding noch margin
Um das gewünschte padding zu erhalten creiert man einen zweiten Container in dem ersten, welchem dann das padding zugewiesen wird.
Da du in deinem Beispiel im animierten Container noch einen p-tag hast, kannst du diesem ja das padding verpassen. Der .toggle-container braucht dann nur noch eine Breite.
Hoffe das hat geholfen,
cheers,
therealAnodyne
Norman says: 16.11.2010
Also mit der festen Breite hast du Recht! Wenn die Container einen vorgeschriebene Breite haben, ruckelt nichts mehr. Mit dem Padding allerdings bin ich mir nich so sicher.. ich geh davon aus, dass jQuery einfach outerwidth() und outerheight() benutzt, da ist das Padding schon mit eingerechnet.
Komisch nur, dass es in der Demo oben auch so geht??
andreas says: 12.07.2010
meine accordion balken springen immer. am anfang läufts flüssig und dann auf dem letzten stück springt es ruckartig zum endpunkt.
Norman says: 26.07.2010
Hallo Andreas,
ja das kenn ich, bei mir trat das Problem im Zusammenhang mit margin auf. margin zählt nicht mit zur Höhe eines Divs, vermutlich springt es deswegen am Ende.. versuch, wo du kannst, auf margin zu verzichten und stattdessen padding zu benutzen.. oder kopiere dir erstmal mein CSS und versuche es dann anzupassen.
Mark says: 23.09.2010
Hi, also ich finde dein Accordion sehr gut. Nachdem das von JQuery UI bei mir einfach nicht funktionieren wollte, warum auch immer … würde ich gerne jetzt den von dir benutzen. Aber dieses springen am Ende der Animation ist wirklich nicht so toll.
Wo muss man denn auf margin verzichten? In deinem CSS gibt es nur eine margin Eigenschaft, wenn ich die durch padding ersetze springt es immer noch.
In meinem style.css für die Webseite sind natürlich viele margin Eigenschaften, kann die auch nicht entfernen.
Norman says: 24.09.2010
Also die Überschriften haben bei mir nur nach unten hin etwas margin, die Container haben rundum etwas padding aber kein margin. Ansonsten wüsste ich nicht, was den Fehler noch verursacht.. kannst du mir eventuell dein Beispiel zeigen, damit ich den Fehler besser untersuchen kann?