Hej..
fel tråd
Knapp som gör saker onsynliga/synliga
38 svar · 2 510 visningar · startad av Boye · sida 2 av 2
Frågan, av Boye
Hej :) Jag undrar hur man gör något onsynligt och sedan en knapp som gör det synligt om man trycker på den? Om man trycker på samma knapp igen blir det onsynligt igen. Någon som vet vilka koder man bör använda till detta, eller kan tipsa om var jag kan hitta information om detta? Jag är inte så duktig på koder ännu. Mvh Boye
Läs frågan i sin helhet →
Den här tror jag skall innehålla det du vill:
http://member.webforum.nu/1123/boye.html
Jag har inte lagt ner något arbete på att göra koden speciellt snygg och den är bara testad i IE6.
Tack igen! Precis så jag ville ha det! :)
Jo i IE och Safari funkar den fint.
Tyvärr så kan man inte alls klicka på knappen (Visa/Dölj tabell) i Morzilla Firefox - det händer inget då.
I Opera fungerar det mesta förutom att allt område som kommer nedanför "Här kan du klicka utan att det händer något." på skärmen fungerar det inte att stänga på.
Vet du hur man löser detta också? :)
Boye skrev:
Vet du hur man löser detta också?
Nej, jag har bara IE på den här datorn.
Ps. Du kan testa att ändra till onclick="toggle('');" på tabellen.
Web-Tor skrev:
Nej, jag har bara IE på den här datorn.
Ps. Du kan testa att ändra till onclick="toggle('');" på tabellen.
Okej. Jag testade det också men tyvärr gör det ingen skillnad :(
Boye skrev:
Jag undrar hur man gör något onsynligt och sedan en knapp som gör det synligt om man trycker på den?
Boye skrev:
Går det att göra så att tablet blir onsynligt igen om jag klickar var som helst förutom på tablet?
Känner mig tvingad att påpeka att det heter osynligt och inte onsynligt.
HiDensity skrev:
Känner mig tvingad att påpeka att det heter osynligt och inte onsynligt.
Tack, det ska jag komma ihåg, behöver bättra på min stavning :)
Koden fungerar verkligen helt magnifikt i de flesta webläsarna. Det är precis som jag vill ha det med skyddat område, bild som ändrar sig när man trycker upp och ner knapp osv, blev mycket bättre än jag kunde tänka :)
Men tyvärr, som sagt så fungerar inte knappen i Firefox. Jag är inte så duktigt på javascript ännu, men jag har försökt mitt aldra bästa, testat allt möjligt jag kan komma på, letat över hela nätet och sökt jättemycket, men jag lyckas inte få knappen att reagera i Firefox endå.
Jag vill helst inte störa dig med mer hjälp för jag har redan fått så mycket jättebra hjälp innan. Men detta är verkligen jätteviktigt för mig och jag har ingen aning om hur jag själv ska kunna gå vidare.
Så därför undrar jag om du kanske skulle ladda ner Firefox (tar bara någon minut) och ta en titt på det? Vore fantastiskt :)
Ptja, det verkar vara så att varken IE eller FF gör rätt i det här fallet gällande display-egenskapen.
Både block och table-row är korrekt CSS.
Web-Tor skrev:
Det är två saker som strulat i FF:
1. FF klarar inte block på table. Lösning
2. FF stödjer inte cancelBubble. Lösning
Tack för svar :)
1. Det här med table är inte så viktigt, jag kan lika bra lägga en div med funktionerna och sedan lägga tablet inuti såhär:
<html>
<head>
<script type="text/javascript">
function toggle(strAction){
obj = document.getElementById('foo');
if(strAction == "show"){
show(obj);
}else if (strAction == "hide"){
hide(obj);
}else if (strAction == "none"){
//sdf
}else{
if(obj.style.display == "none"){
show(obj);
}else{
hide(obj);
}
}
window.event.cancelBubble = true;
}
// Show
function show(obj){
obj.style.display = "block";
}
// Hide
function hide(obj){
obj.style.display = "none";
}
</script>
</head>
<body onclick="toggle('hide');">
<h1>Klicka var som helst på sidan för att dölja tabellen</h1>
<br />
<a href="#" onclick="toggle();return false;">Visa/Dölj tabell</a>
<br />
<div id="foo" style="display:none;" onclick="toggle('none');"><table style="border:5px solid #555;"><tr><td>Tabell som man kan klicka i utan att det händer något.</td></tr></table></div>
<br />
<div style="border:1px dotted #555;" onclick="toggle('none');">Här kan du klicka utan att det händer något.</div>
</body>
</html>
Men enbart det får inte knappen att öppna i Firefox. Dock så märkte jag att om jag inte har style="display:none;", så att "Tabell som man kan klicka i utan att det händer något" är öppen i början så stängs den var man än klickar i Firefox.
2. Jag läste igenom det dokumentet, men tyvärr förstår jag inte exakt hur jag ska göra. Jag menar har aldrig använt javascript tidigare, jag försöker lära mig men det är inte så lätt i början.
Jag hittade i alla fall att jag ska använda något som heter stopPropagation() i samband med cancelBubble, men frågan är bara hur eller var jag ska lägga in det. Jag testade runt lite t ex såhär:
<html>
<head>
<script type="text/javascript">
function toggle(strAction){
obj = document.getElementById('foo');
if(strAction == "show"){
show(obj);
}else if (strAction == "hide"){
hide(obj);
}else if (strAction == "none"){
//sdf
}else{
if(obj.style.display == "none"){
show(obj);
}else{
hide(obj);
}
}
window.event.cancelBubble = true;
stopPropagation = true;
}
// Show
function show(obj){
obj.style.display = "block";
}
// Hide
function hide(obj){
obj.style.display = "none";
}
</script>
</head>
<body onclick="toggle('hide');">
<h1>Klicka var som helst på sidan för att dölja tabellen</h1>
<br />
<a href="#" onClick="toggle();return false;">Visa/Dölj tabell</a>
<br />
<div id="foo" style="display:none;" onclick="toggle('none');"><table style="border:5px solid #555;"><tr><td>Tabell som man kan klicka i utan att det händer något.</td></tr></table></div>
<br />
<div style="border:1px dotted #555;" onClick="toggle('none');">Här kan du klicka utan att det händer något.</div>
</body>
</html>
Men det gav inget resultat direkt.
Har du lust att förklara lite närmare hur jag ska göra? :)
Det här borde fungera i både FF och IE:
http://member.webforum.nu/1123/boye_ff.html
Jaaaaaa! :D Det funkade perfekt i alla webläsare, tack så jättemycket för all hjälp! :)
Toppen! Då kan du markera tråden som löst. :)
Föresten min popup ruta hamnar tyvärr under vissa div:ar på vissa sidor. Finns det något sätt som jag kan få min pop-up ruta att alltid ligga överst? :)
Ah tack, det löste saken :)