toggle jquery
en als ik op een van de knoppen klik moet er een schermpje naar beneden komen met alle inhoud van wat er onder het knopje zit.. nu is het probleem ik heb dit scriptje even in elkaar geflanst maar krijg als ik op 1 button klik het probleem dat ze allemaal opengaan of dicht.. wie kan mij vertellen wat ik fout doe?
er moet dus alleen maar het knopje waar ik op druk opengaan..
Code (php)
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
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
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("#contact").toggle(1000);
});
});
</script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("#portfolio").toggle(1000);
});
});
</script>
<style type="text/css">
#contact{
display:none;
}
#portfolio {
display:none;
}
</style>
<div id="admincontent">
<div>
<button>Contact</button>
<div id="contact">
<?php
include("connect.php");
$result = mysql_query("SELECT * FROM contact");
$i=0;
while($row = mysql_fetch_assoc($result)) {
$naam = $row['naam'];
$achternaam = $row['achternaam'];
$email = $row['email'];
$suggestie = $row['suggestie'];
print "$email | $naam $achternaam <br/><br/> bericht: <br /> $suggestie <hr/>";
$i++;
}
?>
</div>
<br/>
<button>Portfolio bewerken</button>
<div id="portfolio">
<?php
include("connect.php");
$result = mysql_query("SELECT * FROM contact");
$i=0;
while($row = mysql_fetch_assoc($result)) {
$naam = $row['naam'];
$achternaam = $row['achternaam'];
$email = $row['email'];
$suggestie = $row['suggestie'];
print "$email | $naam $achternaam <br/><br/> bericht: <br /> $suggestie <hr/>";
$i++;
}
?>
</div>
<br/>
$(document).ready(function(){
$("button").click(function(){
$("#contact").toggle(1000);
});
});
</script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("#portfolio").toggle(1000);
});
});
</script>
<style type="text/css">
#contact{
display:none;
}
#portfolio {
display:none;
}
</style>
<div id="admincontent">
<div>
<button>Contact</button>
<div id="contact">
<?php
include("connect.php");
$result = mysql_query("SELECT * FROM contact");
$i=0;
while($row = mysql_fetch_assoc($result)) {
$naam = $row['naam'];
$achternaam = $row['achternaam'];
$email = $row['email'];
$suggestie = $row['suggestie'];
print "$email | $naam $achternaam <br/><br/> bericht: <br /> $suggestie <hr/>";
$i++;
}
?>
</div>
<br/>
<button>Portfolio bewerken</button>
<div id="portfolio">
<?php
include("connect.php");
$result = mysql_query("SELECT * FROM contact");
$i=0;
while($row = mysql_fetch_assoc($result)) {
$naam = $row['naam'];
$achternaam = $row['achternaam'];
$email = $row['email'];
$suggestie = $row['suggestie'];
print "$email | $naam $achternaam <br/><br/> bericht: <br /> $suggestie <hr/>";
$i++;
}
?>
</div>
<br/>
Je gebruikt een ID selector inplaats van een CLASS selector
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
2
3
4
5
6
7
8
9
10
11
12
13
14
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$(".contact").toggle(1000);
});
});
</script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$(".portfolio").toggle(1000);
});
});
</script>
$(document).ready(function(){
$("button").click(function(){
$(".contact").toggle(1000);
});
});
</script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$(".portfolio").toggle(1000);
});
});
</script>
Het # dus vervangen met een .
nope alles in class veranders en krijg het nog steedss...
Daar moet je inplaats van de ID ook de class plaatsen.
Is er een mogelijkheid om je code in jsFiddle te plaatsen?
http://jsfiddle.net
Dan kan ik er realtime naar kijken en je de oplossing dmv een link gewoon sturen :)
Mag ook gewoon de output van de HTML, PHP is niet nodig.
ja ik hebb alles veranderd... maar no result ik heb nooit met jsfiddle gewerkt hoe doe ik dit? gewoon inloggen en alle code in de desbetreffende vakjes zetten?
En idd in de juiste vakjes plaatsen
http://jsfiddle.net/P6Azm/ dit is de link k weet alleen niet of ik alles goed erin heb gezet
top!
Reshadd farid op 18/01/2012 14:44:58:
top!
Graag gedaan :)
Als tip wil je ik meegeven, probeer een systeem in je opbouw van code te krijgen, gebruik tabs enzo.
Dat maakt het makkelijk om code te lezen.
Ook een fout die je maakte is dat je 2x een documentReady() had toegevoegd, 1x is genoeg. Daar kan je al je functies in kwijt van jQuery.
Ook je CSS mocht wat geordend worden.
Tis een tip, geen klacht ;)
Voortaan als je problemen hebt met CSS+HTML+JAVASCRIPT, gebruik Fiddle.. Dan hoeft hier ook geen code geplaatst te worden, alleen PHP moet wel hier, daar is PHPhulp voor natuurlijk :D
haha je ik had dit even heel snel gemaaktt ben bezig een portfolio website voormezelf te maken als oefening :p maar het werkt nu tot waar ik het hebben wilde! dankjewel