Link geklikt of niet
Is het mogelijk om (d.m.v. een functie fzo) aan te geven welke link aangeklikt is? (bijvoorbeeld door een andere kleur te geven aan die link). En als dan een andere link aangeklikt wordt, dat dan de kleur van die link verandert, en de vorige aangeklikte link weer normale kleur wordt?
Voorbeeld, want ik denk dat het een beetje onduidelijk is: :P
Link 1 (kleur blauw)
Link 2 (kleur blauw)
Link 3 (kleur blauw)
Waneer er op link 1 geklikt wordt, wordt link 1 groen.
Wanneer er daarna op link 2 geklikt wordt, wordt link 2 groen, en link 1 weer blauw.
Is dit mogelijk?
Misschien een idee hoe het met css moet?
of hoe ik op internet rond kan zoeken, steekwoorden ofzo :)
SanThe schreef op 06.11.2009 16:45:
Volgens mij kan dat met CSS.
Je kunt iets doen met :focus, maar dat wordt niet echt crossbrowser ondersteund (drie maal raden). Je kunt beter met JavaScript aan de gang, of via een GET variabele onthouden wat de laatst aangeklikte link is.
(hulp is natuurlijk altijd welkom:P)
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
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
<?php
ini_set ('display_errors', 1);
error_reporting (E_ALL | E_STRICT);
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Jan Koehoorn</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css" media="screen">
a.cur {border: 5px solid green;}
</style>
</head>
<body>
<div id="container">
<div class="wrapper">
<div id="header">
<div class="wrapper">
<h1>Jan Koehoorn</h1>
</div>
</div>
<div id="nav">
<div class="wrapper">
<ul>
<?php
$items = array ('01', '02', '03', '04', '05');
foreach ($items as $item) {
$class = (isset ($_GET['cur']) && $_GET['cur'] == $item && in_array ($_GET['cur'], $items)) ? (' class="cur"') : (null);
echo '
<li><a' . $class . ' href="?cur=' . $item . '">item ' . $item . '</a></li>
';
}
?>
</ul>
</div>
</div>
<div id="content">
<div class="wrapper">
<h1>Contenttitel</h1>
<p>Contenttekst, contenttekst, contenttekst, contenttekst, contenttekst.</p>
</div>
</div>
<div id="footer">
<div class="wrapper">
<p>Footertekst</p>
</div>
</div>
</div>
</div>
</body>
</html>
ini_set ('display_errors', 1);
error_reporting (E_ALL | E_STRICT);
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Jan Koehoorn</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css" media="screen">
a.cur {border: 5px solid green;}
</style>
</head>
<body>
<div id="container">
<div class="wrapper">
<div id="header">
<div class="wrapper">
<h1>Jan Koehoorn</h1>
</div>
</div>
<div id="nav">
<div class="wrapper">
<ul>
<?php
$items = array ('01', '02', '03', '04', '05');
foreach ($items as $item) {
$class = (isset ($_GET['cur']) && $_GET['cur'] == $item && in_array ($_GET['cur'], $items)) ? (' class="cur"') : (null);
echo '
<li><a' . $class . ' href="?cur=' . $item . '">item ' . $item . '</a></li>
';
}
?>
</ul>
</div>
</div>
<div id="content">
<div class="wrapper">
<h1>Contenttitel</h1>
<p>Contenttekst, contenttekst, contenttekst, contenttekst, contenttekst.</p>
</div>
</div>
<div id="footer">
<div class="wrapper">
<p>Footertekst</p>
</div>
</div>
</div>
</div>
</body>
</html>
Alleen heb ik nu nog 1 probleem...
Hoe kan ik dit integreren in mijn code.
Ik lees gegevens uit een database (odbc). Ik laat dan de kolommen zien, en daaronder de rijen. Als ik op een kolom klik, worden de rijen gesorteerd op dat kolom. Nu wil ik dus dat er aangegeven wordt dat die kolom als laatste aangeklikt is.
Het is misschien een beetje onduidelijk, dus hier is een stukje code uit mijn index.php:
Code (php)
1
2
3
4
5
6
2
3
4
5
6
for ($j=1; $j<= $colName; $j++)
{
echo "<th>";
echo "<a href='$page_name?kolom=" .odbc_field_name($result, $j). "'>" .odbc_field_name ($result, $j ). "</a>"; //laat kolommen zien (als link om te sorteren)
echo "</th>";
}
{
echo "<th>";
echo "<a href='$page_name?kolom=" .odbc_field_name($result, $j). "'>" .odbc_field_name ($result, $j ). "</a>"; //laat kolommen zien (als link om te sorteren)
echo "</th>";
}
Uiteraard neem je het stukje <style> uit de <head> ook mee.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
if($_GET['kolom'] == odbc_field_name($result,$j))
{
echo "<th bgcolor='yellow'>";
echo "<a href='$page_name?kolom=" .odbc_field_name($result, $j). "'>" .odbc_field_name ($result, $j ). "</a>";
echo "</th>";
}
else
{
echo "<th>";
echo "<a href='$page_name?kolom=" .odbc_field_name($result, $j). "'>" .odbc_field_name ($result, $j ). "</a>";
echo "</th>";
}
{
echo "<th bgcolor='yellow'>";
echo "<a href='$page_name?kolom=" .odbc_field_name($result, $j). "'>" .odbc_field_name ($result, $j ). "</a>";
echo "</th>";
}
else
{
echo "<th>";
echo "<a href='$page_name?kolom=" .odbc_field_name($result, $j). "'>" .odbc_field_name ($result, $j ). "</a>";
echo "</th>";
}
Hiermee werkt het perfect.
Toch bedankt voor jullie hulp Jan en SanThe :)