Avatar billede vels Nybegynder
19. februar 2004 - 18:51 Der er 8 kommentarer og
1 løsning

Luk fiv ting før anden kan åbnes

har lig et lille sidste spørgsmål... min kode ser sådan ud:
<html>
    <head>
   

        <title>Untitled</title>
<script type=text/javascript>

var harFokus
var ie = (document.selection.createRange)?true:false


function smilEmil(){
elm = document.getElementById('smiley')
elm.style.display = (elm.style.display=="none")?"block":"none";
}

function tingEmil(){
elm = document.getElementById('ting')
elm.style.display = (elm.style.display=="none")?"block":"none";
}

function indsaet(smil){
if(ie){
  if (harFokus) {
  rng = document.selection.createRange();
  rng.text = smil;
  }
}else
  document.frm.tekst.value += smil
}


function efter(){
document.frm.tekst.focus();
}

</script>
<style type="text/css">
  #luk
    {
    display:block;
    text-align:right;
      margin:0px;
    border-bottom:1px solid #000;
    background-color:#6777B3;
    }

  #smiley
    {
    border:1px solid #000;
    position:absolute;
    height:100px;width:500px;
    }
   
#ting    {
    border:1px solid #000;
    position:absolute;
    height:100px;width:500px;
    }
</style>
    </head>

<body>
<form action="compile.php" method="post" name='frm'>
Filnavn:<br>
<input name="filnavn" value=".tex"><br>
Tekst<br>
<textarea onfocus="harFokus = true;" onblur="harFokus = false"; style="width:644px;height:390px;" name="tekst">

</TEXTAREA><br><br>
<a href="java script:void(0)" onclick="smilEmil();">Indsæt Matematik</a> | <a href="java script:void(0)" onclick="tingEmil();">Greek</a> <br>

<div id="smiley" style="display:none;">
<div id="luk">Matematik                <a href="java script:void(0)" onclick="smilEmil()" title="Luk">X</a></div>

<a href="java script:void(0)" onmousedown="indsaet('\\frace{}{}')" onmouseup="efter();">Brøk</a>&nbsp;
<a href="java script:void(0)" onmousedown="indsaet('x^{}')" onmouseup="efter();">x^k</a>&nbsp;
<a href="java script:void(0)" onmousedown="indsaet('\\sqrt{}')" onmouseup="efter();">Kvadratrod</a>&nbsp;

</div>

<div id="ting" style="display:none;">
<div id="luk">Greek                <a href="java script:void(0)" onclick="tingEmil()" title="Luk">X</a></div>

<a href="java script:void(0)" onmousedown="indsaet('\\gamma')" onmouseup="efter();">Gamma</a>&nbsp;


</div>

<br>
<br>
<br>
<br>
<br>
<br><input type="submit" name="Compile" value="Compile"> <input type="reset" name="Rensfelter" value=Reset>
</form>
<br>



</body>
</html>

NU har jeg 2 af de der windows ting (Greek og Matematik)... hvis jeg har den ene åben og åbner den anden bliver der bare åbnet oven i... har i et eks. på hvordan den automatisk lukker andre åbne og åbne den pågældene man har trykket på??
Avatar billede roenving Novice
19. februar 2004 - 18:58 #1
Du skal bare lukke den anden:

function smilEmil(){
elm = document.getElementById('smiley')
elm.style.display = (elm.style.display=="none")?"block":"none";
document.getElementById('ting').style.display = "none";
}

function tingEmil(){
elm = document.getElementById('ting')
elm.style.display = (elm.style.display=="none")?"block":"none";
document.getElementById('smiley').style.display = "none";
}
Avatar billede vels Nybegynder
19. februar 2004 - 19:56 #2
Hvis nu jeg indsætter flere menuer... så skal hver enkelt menu vel indsættes under de andre så de lukker ikke sandt?
Avatar billede roenving Novice
19. februar 2004 - 20:00 #3
Ja, men du kan klare det med at oprette et array:

var elms = ['smiley','ting','andreTing'];

function lukAlt(){
for(i=0;elms.length>i;i++)
  document.getElementById(elms[i]).style.display = "none";
}

function smilEmil(){
lukAlt();
elm = document.getElementById('smiley');
elm.style.display = (elm.style.display=="none")?"block":"none";
}

function tingEmil(){
lukAlt();
elm = document.getElementById('ting');
elm.style.display = (elm.style.display=="none")?"block":"none";
}
Avatar billede roenving Novice
19. februar 2004 - 20:04 #4
Men så kan du ikke lukke andet end ved at have en knap mere ...

Hvis det skal gøres rigtigt, bliver det:

var elms = ['smiley','ting','andreTing'];

function lukAlt(elmid){
for(i=0;elms.length>i;i++)
  if(elmid!=elms[i])
    document.getElementById(elms[i]).style.display = "none";
}

function visTing(elmid){
lukAlt(elmid);
elm = document.getElementById(elmid);
elm.style.display = (elm.style.display=="none")?"block":"none";
}

-- og så:

<div id="luk">Matematik <a href="java script:void(0)" onclick="visTing('smiley')" title="Luk">X</a></div>

<div id="luk">Greek <a href="java script:void(0)" onclick="visTing('ting')" title="Luk">X</a></div>

-- osv...
Avatar billede vels Nybegynder
19. februar 2004 - 20:06 #5
så virker den første løsning bedrer... for den man åbner... den kan man ikke lukke med krydset (x)
Avatar billede vels Nybegynder
19. februar 2004 - 20:16 #6
nu kan jeg ik lige holde styr på det længere... hvad er det jeg skal indsætte under scripts... det med
<div id="luk">Matematik <a href="java script:void(0)" onclick="visTing('smiley')" title="Luk">X</a></div>

<div id="luk">Greek <a href="java script:void(0)" onclick="visTing('ting')" title="Luk">X</a></div>

har jeg fatter hvor skal være...
Avatar billede roenving Novice
20. februar 2004 - 01:28 #7
Jeg har pillet i en hel del småting, som gav anledning til bekymring ...

Bemærk:

-- i css har jeg brugt classes -- id betyder unikt identifikationsnavn, så der må ikke være flere af dem ...

Men det vigtigste er, at jeg har oprettet een funktion til at vise og skjule, som ved hjælp af lukAlt-funktionen (og arrayet med id'er !-) finder ud af, hvad der skal skjules !-)

-- og jeg har byttet lidt rundt på, hvordan boxene er organiseret, men hvis du bare kigger lidt nærmere efter, er det kun at huske, at ting, som skal til højre skal defineres før ting, som skal bruges normalt !o]

<html>
    <head>
        <title>Untitled</title>
<script type="text/javascript">
var harFokus
var ie = (document.selection.createRange)?true:false
var elms = ['smiley','ting','andreTing'];

function lukAlt(elmid){
for(i=0;elms.length>i;i++)
  if(elmid!=elms[i])
    document.getElementById(elms[i]).style.display = "none";
}

function visTing(elmid){
lukAlt(elmid);
elm = document.getElementById(elmid);
elm.style.display = (elm.style.display!="block")?"block":"none";
}

function indsaet(smil){
if(ie){
  if (harFokus) {
  rng = document.selection.createRange();
  rng.text = smil;
  }
}else
  document.frm.tekst.value += smil
}

function efter(){
document.frm.tekst.focus();
}

</script>
<style type="text/css">
.title{
    display:block;
    margin:0px;
    text-align:center;
    border-bottom:1px solid #000;
    background-color:#6777B3;
}
.luk{float:right;}
.ting{
    border:1px solid #000;
    position:absolute;
    height:100px;width:500px;
    display:none;
    }
</style>
    </head>

<body>
<form action="compile.php" method="post" name='frm'>
Filnavn:<br>
<input name="filnavn" value=".tex"><br>
Tekst<br>
<textarea onfocus="harFokus = true;" onblur="harFokus = false"; style="width:644px;height:390px;" name="tekst">
</textarea><br><br>
<a href="java script:void(0)" onclick="visTing('smiley');">Indsæt Matematik</a> | <a href="java script:void(0)" onclick="visTing('ting');">Greek</a> | <a href="java script:void(0)" onclick="visTing('andreTing');">Tydsk</a> <br>

<div id="smiley" class="ting">
<div class="title"><div class="luk"><a href="java script:void(0)" onclick="visTing('smiley')" title="Luk">X</a>&nbsp;&nbsp;</div>&nbsp;&nbsp;Matematik&nbsp;</div>
<a href="java script:void(0)" onmousedown="indsaet('\\frace{}{}')" onmouseup="efter();">Brøk</a>&nbsp;
<a href="java script:void(0)" onmousedown="indsaet('x^{}')" onmouseup="efter();">x^k</a>&nbsp;
<a href="java script:void(0)" onmousedown="indsaet('\\sqrt{}')" onmouseup="efter();">Kvadratrod</a>&nbsp;
</div>

<div id="ting" class="ting">
<div class="title"><div class="luk"><a href="java script:void(0)" onclick="visTing('ting')" title="Luk">X</a>&nbsp;&nbsp;</div>&nbsp;&nbsp;Greek</div>
<a href="java script:void(0)" onmousedown="indsaet('\\gamma')" onmouseup="efter();">Gamma</a>&nbsp;
</div>

<div id="andreTing" class="ting">
<div class="title"><div class="luk"><a href="java script:void(0)" onclick="visTing('andreTing')" title="Luk">X</a>&nbsp;&nbsp;</div>&nbsp;&nbsp;Tydsk&nbsp;</div>
<a href="java script:void(0)" onmousedown="indsaet('\\gamma')" onmouseup="efter();">Gamma</a>&nbsp;
</div>
<br><br><br><br><br><br>
<input type="submit" name="Compile" value="Compile"> <input type="reset" name="Rensfelter" value=Reset>
</form>
<br>
</body>
</html>
Avatar billede vels Nybegynder
23. februar 2012 - 17:45 #8
roenving, smidder du et svar?
Avatar billede vels Nybegynder
11. maj 2013 - 15:29 #9
lukker
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester