Autor |
Nachricht |
elduderino
Threadersteller
Dabei seit: 09.10.2011
Ort: Augsburg
Alter: 36
Geschlecht:
|
Verfasst Fr 28.10.2011 13:44
Titel JavaScript toggle mit zwei verschiedenen Klassen |
|
|
Hi, habe folgendes Problem:
Habe in css eine Klasse .projects in der div klasse ist noch eine klasse .textbox.
diese project boxen liegen im HTML untereinander und in jeder project box ist eine textbox vorhanden.
Ich will mit jquery die project box aufklappen und die dazugehörigen textbox soll deckkraft erhalten.
Funktioniert soweit alles, dass Problem ist nur was muss ich in jquery schreiben damit er nur die textbox zur zugehörigen projects box sichtbar macht. Wenn ich im moment auf eine Projects box klicke geht nur diese auf (das passt) und alle textboxen werden sichtbar...
(würde gerne (this ".textbox") schreiben, geht aber nicht )
Das habe ich bisher:
script
Code: |
$(".projects").toggle(
function() {
$(this).animate({height: "140px"}, 500)
$(".projects .textbox").animate({opacity: "1"}, 500)},
function() {
$(this).animate({height: "50px"}, 500)
$(".projects .textbox").animate({opacity: "0"}, 500)
});
|
css
Code: | .projects {
float:down;
display:inline-block;
width:750px;
height:50px;
z-index:150;
overflow:hidden;
margin-bottom:10px;
}
.projects .textbox {
float:right;
width:300px;
height:auto;
padding:0px;
z-index:100;
opacity:0;
} |
Danke für die hilfe
|
|
|
|
|
Alex
Dabei seit: 29.11.2005
Ort: Dortmund
Alter: 37
Geschlecht:
|
Verfasst Fr 28.10.2011 14:14
Titel
|
|
|
mach mal aus den zeilen
Code: | $(".projects .textbox").animate({opacity: "1"}, 500)}, |
das hier:
Code: | $(" .textbox", this).animate({opacity: "1"}, 500)}, |
mit der ersten zeile sprichst du ALLE .textbox an, mit der zweiten zeile nur .textbox innerhalb der .projects in der du dich zur Laufzeit befindest.
|
|
|
|
|
Anzeige
|
|
|
elduderino
Threadersteller
Dabei seit: 09.10.2011
Ort: Augsburg
Alter: 36
Geschlecht:
|
Verfasst Fr 28.10.2011 14:36
Titel
|
|
|
danke, genau das wars!
war ich ja gar nicht soweit weg davon...
jetzt is mir grad nur was aufgefallen... wenn ich nen link in der textbox anklicke fährt sie wieder zusammen weil ich ja auch auf die .project box geklickt hab, kann ich das irgendwie unterbinden?
danke nochmal
|
|
|
|
|
pantonine
Dabei seit: 03.03.2011
Ort: gehen Sie bitte weiter…
Alter: -
Geschlecht: -
|
Verfasst Fr 28.10.2011 14:55
Titel
|
|
|
Benutze kein toggle bzw. toggle mit explizitem Parameter true/false
|
|
|
|
|
elduderino
Threadersteller
Dabei seit: 09.10.2011
Ort: Augsburg
Alter: 36
Geschlecht:
|
Verfasst Fr 28.10.2011 16:06
Titel
|
|
|
okay, der link befindet sich in der .textbox wird also die textbox geklickt darf nichts passieren...
Bin mir ziemlich sicher das es so funktionieren müsste, hab da aber leider schon wieder irgendwo nen syntax fehler drin...
Code: |
$(".projects").toggle(
if($(".projects .textbox", this).click(function(event))==true){}
else{
function() {
$(this).animate({height: "140px"}, 500)
$(" .textbox", this).animate({opacity: "1"}, 500)},
function() {
$(this).animate({height: "50px"}, 500)
$(" .textbox", this).animate({opacity: "0"}, 500)
}});
|
er bringt nen fehler in Zeile 2 bei der If abfrage...
|
|
|
|
|
DEKONSTRUKTIV
Dabei seit: 22.06.2009
Ort: bln
Alter: -
Geschlecht: -
|
Verfasst Fr 28.10.2011 16:44
Titel
|
|
|
gewöhn dir mal ordentliche notation mit vernünftiger indentation an, dann fällt dir sofort auf, dass dein klammergeraffel nich korrekt is.
|
|
|
|
|
elduderino
Threadersteller
Dabei seit: 09.10.2011
Ort: Augsburg
Alter: 36
Geschlecht:
|
Verfasst Fr 28.10.2011 17:28
Titel
|
|
|
sorry habs mir jetzt paar mal durchgeschaut ich find den fehler nicht.
|
|
|
|
|
DEKONSTRUKTIV
Dabei seit: 22.06.2009
Ort: bln
Alter: -
Geschlecht: -
|
Verfasst Fr 28.10.2011 17:33
Titel
|
|
|
du sollst nich kucken, sondern vernünftig eingerückten code schreiben. grundsätzlich is das, was du da mit dem click event handler machst, augenscheinlich nich regulär.
Zuletzt bearbeitet von DEKONSTRUKTIV am Fr 28.10.2011 17:40, insgesamt 1-mal bearbeitet
|
|
|
|
|
|
|
|
Ähnliche Themen |
CSS Selektor bauen für TR-tag mit zwei Klassen
Zwei CSS-Klassen auf einem Tag in E-Mail-Newsletter
Illustrator CS3: Pfad + zwei verschiedenen Endpunkt-Stärken
OSM/Javascript: Marker auf verschiedenen Layern anklicken?
CSS: links in klassen definieren -pseudoklassen in klassen?
Zwei JavaScript Befehle auf einem Link?
|
|