Akkordeon Effekt

Web Acappella - Forum, Tips und Tricks zum Bauen von Webseiten � Web Acappella � TEMPLATES UND PLUGINS - Design- und Script- Erweiterung zu Web Acappella � Akkordeon Effekt

Themen-Einstellungen

Thema drucken

Bereich wechseln

Rund um das Forum SPAM - USER Vor dem Einloggen bitte die Nutzungsbedingungen und Datenschutzerkl�ru... Ank�ndigungen Hilfe Web Acappella ANK�NDIGUNGEN rund um Web Acappella Ank�ndigungen Version 4 Ank�ndigungen Version 3 SEITENVORSTELLUNGEN - stellt Eure Seiten vor und erntet Lob und Kritik FAQ - Antworten zu Programmfunktionen FAQ Allgemein FAQ Version 4 FAQ Version 3 FRAGEN ZU PROBLEMEN Allgemeine Fragen Fragen zur Version 4 Fragen zur Version 3 TIPPS UND TRICKS - Anleitungen zu Erweiterungen der Programmfunktionen Allgemeine Tipps und Tricks Tipps und Tricks f�r Version 4 Tipps und Tricks f�r Version 3 Tipps und Tricks f�r Responsive Design TEMPLATES UND PLUGINS - Design- und Script- Erweiterung zu Web Acappella FEHLER UND ANREGUNGEN rund ums Programm WEB - SHOP - SYSTEM Off Topic Mitglieder stellen sich vor Tools, Anwendungen HTML & Co Mac Windows Grafik Video Sonstiges

#1 | Akkordeon Effekt datum

21.01.2016 08:31

arimon2010

Informationen anzeigen

Beitr�ge:	3
Registriert seit:	11.08.2014

Hallo,
ich hatte letztens schon einmal eine Frage zum Akkordeon Effekt in Webacappella gestellt und auch Rat gefunden. Allerdings funktioniert der Code nicht wirklich auf meiner Seite.
Er bringt auf der Seite wo ich das Akkordeon als HTML einfüge total durcheinander. Kann mir damit vlt wer weiterhelfen ?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
 
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Unbenanntes Dokument</title>
<style type="text/css">
<!--
 
/* Hier die Breite anpassen */
#akkordeon {
  width: 800px;
  overflow: hidden; }
 
/* Aussehen Titel */
#akkordeon h2 {
  font-size: 20px;
  color: #009090;
  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;
  transition: all .2s ease-in-out; }
 
/* ausklappbare Feld mit Inhalt */
#akkordeon .inhalt {
  display: none;
  background-color: #009090;
  padding: 15px;
  margin-bottom: 5px;
  overflow: hidden;
  border: 1px solid #c9c9c9; }
 
/* Farbe Titelfeld wenn ausgeklappt */
#akkordeon .open { background-color: #999999f!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: #999999;"> <h2>Die Jahre 1879 - 1945 </h2> </div>
<div class="inhalt"> 1879 - TEST <p>  
TEST<p> 
TEST <br>TEST#BILD# <p>
TEST <br>
TEST <br>
TEST <br>
TEST <br>
TEST</div>
</div>
 
<div class="top">
<div class="thema closed" style="background: #999999;"> <h2>Die Jahre 1951 - 1971 </h2> </div>
<div class="inhalt"> 1951 - TEST <p>
1951 - TEST <br>
1965 - TEST<br>
1970 - TEST <br>
1970 - TEST <p>
1971 - TEST#BILD#</div>
</div>
 
<div class="top">
<div class="thema closed" style="background: #999999;"> <h2>Die Jahre 1972 - 1998 </h2> </div>
<div class="inhalt"> 1972 - TEST #BILD#<p>
1974 - TEST #BILD# <p>
1978 - TEST #BILD# <p>
1979 - TEST<br>
1982 - TEST <br>
1982 - TEST <br>
1986 - TEST <br>
1986 - TEST #BILD#<p>
1995 - TEST<br>
1996 - TEST <br>
1997 - TEST <br>
1998 - TEST
1998 - TEST</div>
 
<div class="top">
<div class="thema closed" style="background: #999999;"> <h2> Die Jahre 2002 bis Heute </h2></div>
<div class="inhalt"> 2002 - TEST #BILD#<p>
2003 - TEST <br>
2004 - TEST #BILD#<p>
2005 - TEST #BILD# <p>
</div>
</div>
 
</div>
</head>
 
<body>
</body>
</html>
 
 

Antworten

#2 | RE: Akkordeon Effekt datum

22.01.2016 08:50

Link zum Problemkind?

Ohne Einsicht in die Seite kann keine Begutachtung erfolgen, also auch kein Lösungsvorschlag!!!

Antworten

Responsives Design � � Template´s für WebAcappella

Bitte geben Sie einen Grund f�r die Verwarnung an