Avatar billede gecko Nybegynder
15. maj 2002 - 21:45 Der er 25 kommentarer og
1 løsning

Klik ---> visning af lag med tekst (stylesheet)

Hvordan kan man lave sådan at, hvis man klikker på et link, så kommer der et (gennemsigtigt) lag frem med tekst (stylesheet), som så forsvinder igen ved klik på nyt link ???
Avatar billede jakoba Nybegynder
15. maj 2002 - 21:58 #1
Bare lad være med at angive en baggrund til laget, så bliver det gennemsigtigt
Avatar billede gecko Nybegynder
15. maj 2002 - 22:02 #2
det er ikke det der er problemet.....problemet er at få laget frem ved klik !!! :-)
Avatar billede hono Nybegynder
15. maj 2002 - 22:40 #3
Kan det bruges:

<html>
<body>
<p onclick="lag.style.visibility='visible';">Gør synlig</p>
<p onclick="lag.style.visibility='hidden';">Gør usynlig</p>

<span style="visibility:hidden" id="lag">Her er noget tekst</spam>
</body>
</html>

???

Hono
Avatar billede hono Nybegynder
15. maj 2002 - 22:40 #4
ups:

Kan det bruges:

<html>
<body>
<p onclick="lag.style.visibility='visible';">Gør synlig</p>
<p onclick="lag.style.visibility='hidden';">Gør usynlig</p>

<span style="visibility:hidden" id="lag">Her er noget tekst</span>
</body>
</html>
Avatar billede gryn Nybegynder
15. maj 2002 - 22:42 #5
Dette virker i X-browser


///////I head skriver du:

<script language="javascript" type="text/javascript">
function vis(obj){

if (document.getElementById){sabine = eval("document.getElementById('"+obj+"').style");}
else if (document.all){sabine = eval("document.all"+obj+".style");}
else {sabine = eval("document."+obj+".style");}

if (document.layers) {sabine.visibility = "show";}
else {sabine.visibility = "visible";}
    }
function skjul(obj){

if (document.getElementById){sabine = eval("document.getElementById('"+obj+"').style");}
else if (document.all){sabine = eval("document.all"+obj+".style");}
else {sabine = eval("document."+obj+".style");}

if (document.layers) {sabine.visibility = "hide";}
else {sabine.visibility = "hidden";}
    }
</script>


/////////I body-linien skriver du:
<body onload="skjul('grunden');">


/////////I body skriver du

<a href="#" onclick="vis('grunden')">Læs om Grunden.dk</a>
&nbsp;
<a href="#" onclick="skjul('grunden')">Luk mig igen</a>

<div id="grunden">
Her kan du finde alle mine små mærkelige venner.
</div>
Avatar billede gryn Nybegynder
15. maj 2002 - 22:47 #6
Eller endnu bedre Nu virker den også NS6
Skift scriptet ud med dette:

<script language="javascript" type="text/javascript">
var ns6 = (document.getElementById && !document.all)?true:false;

function vis(obj){
if (ns6){sabine.display="";}
else {
if (document.getElementById){sabine = eval("document.getElementById('"+obj+"').style");}
else if (document.all){sabine = eval("document.all"+obj+".style");}
else {sabine = eval("document."+obj+".style");}

if (document.layers) {sabine.visibility = "show";}
else {sabine.visibility = "visible";}
}
    }
function skjul(obj){
if (ns6){sabine.display="none";}
else {
if (document.getElementById){sabine = eval("document.getElementById('"+obj+"').style");}
else if (document.all){sabine = eval("document.all"+obj+".style");}
else {sabine = eval("document."+obj+".style");}

if (document.layers) {sabine.visibility = "hide";}
else {sabine.visibility = "hidden";}
}
    }
</script>
Avatar billede gecko Nybegynder
15. maj 2002 - 22:59 #7
Tjaa.....naaaaaa

hono og gryn: det er meget tæt på, men når det nu er noget der skal komme ved klik på menuknap, så skal det væk igen, ved klik på ny menuknap.

Måske kan jeg godt tænke mig ud af den.......men er lidt "kode-dum" nu hvor jeg har siddet med det her hele dagen !!!
Avatar billede cdc Novice
15. maj 2002 - 23:02 #8
er det noget i denne rettning ? http://hjem.get2net.dk/arntsen/exp/index.html

/cdc
Avatar billede cdc Novice
15. maj 2002 - 23:07 #9
http://hjem.get2net.dk/arntsen/eksperten/diverse/top_menu_02.htm se under referencer, doh her med links, kunne blot være text

/cdc
Avatar billede hono Nybegynder
15. maj 2002 - 23:08 #10
menuknap? Er det et billede du har, eller er det sådan en "formular-knap"?

Hono
Avatar billede gecko Nybegynder
15. maj 2002 - 23:10 #11
det er en menuknap
Avatar billede gryn Nybegynder
15. maj 2002 - 23:12 #12
Må vi se siden?
Avatar billede gecko Nybegynder
15. maj 2002 - 23:15 #13
/cdc: i retning af hvad på:  http://hjem.get2net.dk/arntsen/exp/index.html ???


Den på det næste link, hjælper mig med noget andet jeg leder efter....tak....kan man erstatte de "overordnede" links med billeder ???
Avatar billede gecko Nybegynder
15. maj 2002 - 23:19 #14
gryn: ja, hvis du giver mig din mail.....så sender jeg et link....vil helst ikke gøre det her !!
Avatar billede gryn Nybegynder
15. maj 2002 - 23:22 #15
uis@ofir.dk
Avatar billede gryn Nybegynder
15. maj 2002 - 23:35 #16
Hvad er det den skal? Er det når man holder musen over billerene, at der skal komme en tekst frem?

Eller skal der komme et "vindue" frem, når der klikkes, som derefter skal kunne lukkes igen ved en knap inde i "vinduet"?
Avatar billede gecko Nybegynder
15. maj 2002 - 23:41 #17
jaaaa, hvad skal den egentlig :-)

når man klikker skal der komme et vindue op evt. midt på siden. dette vindue skal være gennemsigtig (ikke tranparant, en eller anden farve med 30 i opasity). herpå skal der stå noget tekst.
når man så klikker på næste link, så skal dette erstattes af noget nyt som ligner, men med anden tekst......og det skal ikke altid være samme sted på siden.

forstår du ???

Nat nat...nu kan jeg ikke mere !!!
Avatar billede gryn Nybegynder
15. maj 2002 - 23:45 #18
Ja... jeg forstår. Den ordner jeg!
Avatar billede gryn Nybegynder
16. maj 2002 - 00:18 #19
<html>
<head>
<title>Vis/Skjul layer</title>
<script language="javascript" type="text/javascript">

// //////////////////////////////////////Her er scriptet.... det skal du ikke pille ved

var ns6 = (document.getElementById && !document.all)?true:false;

var gamle = "fuckdet"
var thebase = true

function glo(obj){
if (ns6){sabine.display="";}
else {
if (document.getElementById){sabine = eval("document.getElementById('"+obj+"').style");}
else if (document.all){sabine = eval("document.all"+obj+".style");}
else {sabine = eval("document."+obj+".style");}

if (document.layers) {sabine.visibility = "show";}
else {sabine.visibility = "visible";}
}
    }

function vis(obj){
skjul(gamle);
gamle = obj;



if (ns6){sabine.display="";}
else {
if (document.getElementById){sabine = eval("document.getElementById('"+obj+"').style");}
else if (document.all){sabine = eval("document.all"+obj+".style");}
else {sabine = eval("document."+obj+".style");}

if (document.layers) {sabine.visibility = "show";}
else {sabine.visibility = "visible";}
}
    }
function skjul(obj){
if (ns6){sabine.display="none";}
else {
if (document.getElementById){sabine = eval("document.getElementById('"+obj+"').style");}
else if (document.all){sabine = eval("document.all"+obj+".style");}
else {sabine = eval("document."+obj+".style");}

if (document.layers) {sabine.visibility = "hide";}
else {sabine.visibility = "hidden";}
}
    }


</script>


</head>

<!-- /////////////////////// Du skal f.eks. skrive skjul('link1') for at skjule Laget  til link1 fra starten --/>

<body onload="skjul('link1');skjul('link2');skjul('base');">


<!-- /////////////////////// Dette er dine billeder her skal du f.eks. tilføje  onclick="glo('base');vis('link1');", hvis laget link1 passer til dette billede --/>
<SPAN id=foerste>
<A href="#" onmouseover="document.images.knap1.border=1"; onMouseOut="document.images.knap1.border=0;" onclick="glo('base');vis('link1');">
<img src="blaa/blaaknap1.jpg" name="knap1" border="0" alt="Linktekst" style="border-color:#FFFFFF">
</a>
</SPAN>&nbsp;
<SPAN id=anden>
<A href="#" onmouseover="document.images.knap2.border=1"; onMouseOut="document.images.knap2.border=0;" onclick="glo('base');vis('link2');">
<img src="blaa/blaaknap2.jpg" name="knap2" border="0" alt="Linktekst" style="border-color:#FFFFFF">
</a>
</SPAN>

<!-- /////////////////////// Disse 2 lag skal du ikke røre ved, med mindre du vil ændre positionen --/>

<div id="fuckdet" style="position:absolute; top:-200; left:-300;width:300; height:250;">
&nbsp;
</div>

<div id="base" style="position:absolute; top:150; left:300;width:300; height:250; background-color:#AA0000;filter:alpha(opacity=30);-moz-opacity:0.3"">
&nbsp;
</div>


<!-- /////////////////////// Her kommer de lag, der passer til billederne... lav selv resten --/>

<div id="link1" style="position:absolute; top:150; left:300;width:300; height:250;">
Her kan du finde alle mine små mærkelige venner.<br><br>
link 1
</div>

<div id="link2" style="position:absolute; top:150; left:300;width:300; height:250;">
<br>HEY<br>
Her kan du finde alle mine små mærkelige venner.<br><br>
link 2
</div>

</body>
</html>


Så skulle den være der... spørg, hvis du skal bruge mere hjælp.
Avatar billede cdc Novice
16. maj 2002 - 00:40 #20
gecko: du kan se den med billed og text på www.dhha.dk under kategorier

/cdc
Avatar billede gecko Nybegynder
16. maj 2002 - 11:50 #21
Gryn:
Tak fordi du er så hjælpsom.....jeg skal lige bruge noget tid på at overskue det hele.......jeg tror ikke jeg får forklaret ordentlig hvad jeg mener !!!
Avatar billede gryn Nybegynder
16. maj 2002 - 20:16 #22
ok... det skal ikke være det samme sted på siden. Det kan jeg godt ordne, men lige et øjeblik... jeg har også lige en anden lille rettelse.
Avatar billede gryn Nybegynder
16. maj 2002 - 20:31 #23
Nu har jeg den vist. Nu virder den også i NS6, og nu kan du skafte position for hver link.
HERE GOES:
-----------------------------------------

<html>
<head>
<title>Vis/Skjul layer</title>
<script language="javascript" type="text/javascript">

// //////////////////////////////////////Her er scriptet.... det skal du ikke pille ved

var ns6 = (document.getElementById && !document.all)?true:false;

var gamle = "fuckdet"
var thebase = true

function glo(obj,xpos,ypos){

if (document.getElementById){sabine = eval("document.getElementById('"+obj+"').style");}
else if (document.all){sabine = eval("document.all"+obj+".style");}
else {sabine = eval("document."+obj+".style");}

if (ns6){sabine.display="";}
else {
if (document.layers) {sabine.visibility = "show";}
else {sabine.visibility = "visible";}
}
sabine.top = ypos
sabine.left = xpos
    }

function vis(obj,xpos,ypos){
glo('base',xpos,ypos)
skjul(gamle);
gamle = obj;


if (document.getElementById){sabine = eval("document.getElementById('"+obj+"').style");}
else if (document.all){sabine = eval("document.all"+obj+".style");}
else {sabine = eval("document."+obj+".style");}

if (ns6){sabine.display="";}
else {
if (document.layers) {sabine.visibility = "show";}
else {sabine.visibility = "visible";}
}
sabine.top = ypos
sabine.left = xpos
    }





function skjul(obj){

if (document.getElementById){sabine = eval("document.getElementById('"+obj+"').style");}
else if (document.all){sabine = eval("document.all"+obj+".style");}
else {sabine = eval("document."+obj+".style");}

if (ns6){sabine.display="none";}
else {
if (document.layers) {sabine.visibility = "hide";}
else {sabine.visibility = "hidden";}
}

    }


</script>


</head>

<!-- /////////////////////// Du skal f.eks. skrive skjul('link1') for at skjule Laget  til link1 fra starten --/>

<body onload="skjul('link1');skjul('link2');skjul('base');">


<!-- /////////////////////// Dette er dine billeder her skal du f.eks. tilføje  onclick="vis('link1', 200, 300);", hvis laget link1 passer til dette billede --/>
<!-- /////////////////////// 200 og 300 er koordinaterne for positionen (x,y) --/>
<SPAN id=foerste>
<A href="#" onmouseover="document.images.knap1.border=1"; onMouseOut="document.images.knap1.border=0;" onclick="vis('link1',200,300);">
<img src="blaa/blaaknap1.jpg" name="knap1" border="0" alt="Linktekst" style="border-color:#FFFFFF">
</a>
</SPAN>&nbsp;
<SPAN id=anden>
<A href="#" onmouseover="document.images.knap2.border=1"; onMouseOut="document.images.knap2.border=0;" onclick="vis('link2',300,200);">
<img src="blaa/blaaknap2.jpg" name="knap2" border="0" alt="Linktekst" style="border-color:#FFFFFF">
</a>
</SPAN>

<!-- /////////////////////// Disse 2 lag skal du ikke røre ved--/>

<div id="fuckdet" style="position:absolute; top:-200; left:-300;width:300; height:250;">
&nbsp;
</div>

<div id="base" style="position:absolute; top:150; left:300;width:300; height:250; background-color:#AA0000;filter:alpha(opacity=30);-moz-opacity:0.3"">
&nbsp;
</div>


<!-- /////////////////////// Her kommer de lag, der passer til billederne... lav selv resten --/>

<div id="link1" style="position:absolute; top:150; left:300;width:300; height:250;">
Her kan du finde alle mine små mærkelige venner.<br><br>
link 1
</div>

<div id="link2" style="position:absolute; top:150; left:300;width:300; height:250;">
<br>HEY<br>
Her kan du finde alle mine små mærkelige venner.<br><br>
link 2
</div>

</body>
</html>

-------------------------------------------------------

Håber virkelig, jeg har lavet det rigtige til dig denne gang.
Avatar billede gecko Nybegynder
16. maj 2002 - 21:03 #24
Jeg har fået det til at virke med det første du gav mig.......tusind tak !!!
Avatar billede gryn Nybegynder
16. maj 2002 - 21:25 #25
takker for point
Avatar billede gecko Nybegynder
16. maj 2002 - 21:28 #26
kig lige på mit nye indlæg !!!! kan du også klare dette ???
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