Visibility toggle
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<script>
function show()
{
alert(document.getElementById('text').style.visibility);
el = document.getElementById('text');
if(el.style.visibility == "visible")
{
el.style.visibility = "hidden";
}
else
{
el.style.visibility = "visible";
}
}
</script>
function show()
{
alert(document.getElementById('text').style.visibility);
el = document.getElementById('text');
if(el.style.visibility == "visible")
{
el.style.visibility = "hidden";
}
else
{
el.style.visibility = "visible";
}
}
</script>
Dit leek te kloppen volgens mij, alleen als de pagina open werkt het niet, het visible wel alleen de hidden niet...
kan iemand helpen
Gewijzigd op 01/01/1970 01:00:00 door Jan Veenstra
moet je bij dat script niet iets in de body zetten? Een onload?
Dat heb ik namelijk wel in dit script (misschien kun je er wat meer mee)
Dat heb ik namelijk wel in dit script (misschien kun je er wat meer mee)
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
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
<html>
<head>
<title> hidden </title>
<script language="javascript">
function Toggle(item)
{
obj = document.getElementById(item);
visible = (obj.style.display!="none");
if(visible)
{
obj.style.display="none";
}
else
{
obj.style.display="block";
}
}
</script>
</head>
<body onload="Toggle('show_div');">
<a href="javascript:Toggle('show_div')">tekst</A><br/>
<div id="show_div">
Hier komt de hidden stuff te staan
</div>
</body>
</html>
<head>
<title> hidden </title>
<script language="javascript">
function Toggle(item)
{
obj = document.getElementById(item);
visible = (obj.style.display!="none");
if(visible)
{
obj.style.display="none";
}
else
{
obj.style.display="block";
}
}
</script>
</head>
<body onload="Toggle('show_div');">
<a href="javascript:Toggle('show_div')">tekst</A><br/>
<div id="show_div">
Hier komt de hidden stuff te staan
</div>
</body>
</html>
nee dit is zowizo anders omdat ik geen display wil gebruiken...
Ik denk dat jouw pagina opnieuw laadt als je op die hyperlink klikt, klopt dat?
nee het is geen link, gewoon een onclick op een <u> die pakt hij ook, alleen niet de 2e keer... Hij doet het maar 1 maal
klik maar is op de naam
klik maar is op de naam
Gewijzigd op 01/01/1970 01:00:00 door Jan Veenstra
Bedoel je het zo: toggle visibility
is die code niet wat overdreven?
mijn manier is toch ook goed?
mijn manier is toch ook goed?
Als jouw code goed is, waarom open je er dan een topic over?
omdat hij niet werkt;) ik bedoel het idee;)
Natuurlijk is die code wat overdreven, hij werkt met Mootools wat voor zoiets kleins helemaal niet nodig is. Maar als je al Mootools gebruikt, is dit wel heel handig. Als je geen Mootools gebruikt zou jou code goed genoeg moeten zijn, ik heb nog geen idee waarom die niet werkt... Als je even duidelijk zegt waar ik zou moeten klikken op jouw website om die action the triggeren, kan ik wel wat gaan proberen...
in de eerste zin op de naam
Gewijzigd op 01/01/1970 01:00:00 door Jan Veenstra
Okay, misschien ligt het aan mij, maar er gebeurt hier überhaupt niets... Ook niet de eerste keer dat ik klik...
Ik zie overigens dat je PrototypeJS gebruikt, dan kun je toch ook zo doen:?
Ik zie overigens dat je PrototypeJS gebruikt, dan kun je toch ook zo doen:?
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
function toggle(el)
{
el = $(el);
if(el.getStyle('visibility') == "visible")
{
el.setStyle({visibility: 'hidden'});
}
else
{
el.setStyle({visibility: 'visible'});
}
}
{
el = $(el);
if(el.getStyle('visibility') == "visible")
{
el.setStyle({visibility: 'hidden'});
}
else
{
el.setStyle({visibility: 'visible'});
}
}
Gewijzigd op 01/01/1970 01:00:00 door Douwe
huh? bij mij wel... IE7
In FF NIet! wate piep
Ik gebruik FF3 inderdaad... Misschien kun je mijn nieuwe post even proberen? En waarom wil je geen display gebruiken?
En dat was een bump ;)
En dat was een bump ;)
Gewijzigd op 01/01/1970 01:00:00 door Douwe
'Douwe:
Natuurlijk is die code wat overdreven, hij werkt met Mootools wat voor zoiets kleins helemaal niet nodig is.
Ja, als dit het enige zou zijn op je hele site wat je nodig hebt aan JavaScript, dan is het onnodige overhead. Maar je kunt het ook zo bekijken: gecomprimeerd is Mootools 63 KB, de grootte van een gemiddelde jpg. In verhouding tot wat je daarvoor krijgt aan (crossbrowser!) JavaScript functionaliteit vind ik dat zeer aanvaardbaar.
De reden dat jouw script niet werkt heeft te maken met een bug in sommige browsers. Als de style visibility nog niet expliciet toegekend is, reageert bijvoorbeeld IE6 niet. Je moet hem dan dus eerst bij de onload zelf op visible zetten en daarna pas je toggle script toepassen.
Gewijzigd op 01/01/1970 01:00:00 door Jan Koehoorn
Jan; Natuurlijk :) Zoals ik ook zei: Als je Mootools alleen hiervoor installeert is het een beetje zinloos, maar als je het al gebruikt (wat je eigenlijk altijd zou moeten doen als je een beetje met JS wilt gaan doen) is het een goede optie :)
display werkt ook niet...
Hmmmm... Mijn codetje al geprobeerd?
heb een code gebruikt die normaal wel werkte, doet precies het zelfde.
is er ist op mijn pagina waar hij een conflict mee kan hebben?
is er ist op mijn pagina waar hij een conflict mee kan hebben?
@ Johan: hoe kort wil je het hebben? Hier, zeven regeltjes JavaScript (inclusief de script tags), plus de functionaliteit van Mootools in je site:
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<script type="text/javascript">
window.addEvent ('domready', function () {
$('toggle').addEvent ('click', function (e) {
$('container').setStyle ('visibility', ($('container').getStyle ('visibility') == 'visible') ? ('hidden') : ('visible'));
});
});
</script>
window.addEvent ('domready', function () {
$('toggle').addEvent ('click', function (e) {
$('container').setStyle ('visibility', ($('container').getStyle ('visibility') == 'visible') ? ('hidden') : ('visible'));
});
});
</script>
Gewijzigd op 01/01/1970 01:00:00 door Jan Koehoorn




