/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Pop op vindue/område ved klik
Fra : Lars Petersen


Dato : 01-03-06 16:05

Jeg kan huske jeg flere gange på nettet har set eksempler hvor
man ved at klikke på et lille stykke tekst får en lille rude op
med lidt information - lidt lige som en "post it note". Da jeg
har lavet en "kalender" på min side, har jeg brug for at brugeren
kan få lidt yderligere information om arrangementer (som kun kan
ses på "overskriftform") når de klikker på en begivenhed i
"kalenderen". Kan nogen give mig lidt hjælp, hints? Og hvis det
er muligt, så helst på "for dummies" niveau Takker!

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

 
 
Jørgen Farum Jensen (01-03-2006)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 01-03-06 16:45

Lars Petersen wrote:
> Jeg kan huske jeg flere gange på nettet har set eksempler hvor
> man ved at klikke på et lille stykke tekst får en lille rude op
> med lidt information - lidt lige som en "post it note". Da jeg
> har lavet en "kalender" på min side, har jeg brug for at brugeren
> kan få lidt yderligere information om arrangementer (som kun kan
> ses på "overskriftform") når de klikker på en begivenhed i
> "kalenderen". Kan nogen give mig lidt hjælp, hints? Og hvis det
> er muligt, så helst på "for dummies" niveau Takker!
>

På websiden:

<span class="trigger" onclick="visNote(nr)">Dag,dato
<span class="note" id="note1">Mere tekst</span></span>

I et stylesheet:

..note {
position:absolute;
left:3em;
top:0;
z-index:1;
display:none;
padding:3px;
border:1px solid black;
color:maroon;
background:white;}
..trigger {
position:relative;}

Og en triggerfunktion:

<script type="text/javascript">
function visNote(nr) {
if (document.getElementById('note'+nr).style.display == "inline") {
document.getElementById('note'+nr).style.display="none";
}
else {
document.getElementById('note'+nr).style.display="inline";
}}
</script>

Første klik på Dag,dato vil vise teksten, andet klik vil fjerne
den igen.

--

Med venlig hilsen

Jørgen Farum Jensen
http://www.webdesign101.dk
..

Lars Petersen (01-03-2006)
Kommentar
Fra : Lars Petersen


Dato : 01-03-06 17:14

Jørgen Farum Jensen wrote in dk.edb.internet.webdesign.html:
> Lars Petersen wrote:
> > Jeg kan huske jeg flere gange på nettet har set eksempler hvor
> > man ved at klikke på et lille stykke tekst får en lille rude op
> > med lidt information - lidt lige som en "post it note". Da jeg
> > har lavet en "kalender" på min side, har jeg brug for at brugeren
> > kan få lidt yderligere information om arrangementer (som kun kan
> > ses på "overskriftform") når de klikker på en begivenhed i
> > "kalenderen". Kan nogen give mig lidt hjælp, hints? Og hvis det
> > er muligt, så helst på "for dummies" niveau Takker!
> >
>
> På websiden:
>
> <span class="trigger" onclick="visNote(nr)">Dag,dato
> <span class="note" id="note1">Mere tekst</span></span>
>
> I et stylesheet:
>
> ..note {
> position:absolute;
> left:3em;
> top:0;
> z-index:1;
> display:none;
> padding:3px;
> border:1px solid black;
> color:maroon;
> background:white;}
> ..trigger {
> position:relative;}
>
> Og en triggerfunktion:
>
> <script type="text/javascript">
> function visNote(nr) {
> if (document.getElementById('note'+nr).style.display == "inline") {
> document.getElementById('note'+nr).style.display="none";
> }
> else {
> document.getElementById('note'+nr).style.display="inline";
> }}
> </script>
>
> Første klik på Dag,dato vil vise teksten, andet klik vil fjerne
> den igen.
>
> --
>
> Med venlig hilsen
>
> Jørgen Farum Jensen
> http://www.webdesign101.dk
> ..

Mange tak for dit hurtige svar. Jeg er dog ked af det, men jeg ved ikke
helt hvad jeg skal gøre med de tre "bidder". Jeg har oprettet et html-dok
hvor første del er indsat. Anden del er lavet i et CSS hvortil der er
linket fra html-siden. Jeg ved dog ikke hvad jeg skal gøre med "trigger"
fuktionen? I "head" på html-dok? Har kigget lidt på din hjemmeside -
temmeligt imponerende. Er der et sted derpå med en artikel omkring
ovenstående som jeg kan læse i ro og mag? Mvh Lars

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Dennis Munding (01-03-2006)
Kommentar
Fra : Dennis Munding


Dato : 01-03-06 17:26

Hej Lars!
"Lars Petersen" <lape@aue.auc.dk> skrev i en meddelelse
news:4405c83f$0$15791$14726298@news.sunsite.dk...
> Jørgen Farum Jensen wrote in dk.edb.internet.webdesign.html:
>> Og en triggerfunktion:
>>
>> <script type="text/javascript">
>> function visNote(nr) {
>> if (document.getElementById('note'+nr).style.display == "inline") {
>> document.getElementById('note'+nr).style.display="none";
>> }
>> else {
>> document.getElementById('note'+nr).style.display="inline";
>> }}
>> </script>
>>
>> Første klik på Dag,dato vil vise teksten, andet klik vil fjerne
>> den igen.
>
> Mange tak for dit hurtige svar. Jeg er dog ked af det, men jeg ved ikke
> helt hvad jeg skal gøre med de tre "bidder". Jeg har oprettet et html-dok
> hvor første del er indsat. Anden del er lavet i et CSS hvortil der er
> linket fra html-siden. Jeg ved dog ikke hvad jeg skal gøre med "trigger"
> fuktionen? I "head" på html-dok? Har kigget lidt på din hjemmeside -
> temmeligt imponerende. Er der et sted derpå med en artikel omkring
> ovenstående som jeg kan læse i ro og mag? Mvh Lars

Den skal placeres imellem <head> og </head>.....

M.h.t. artikel, så står der noget i samme stil (omend ikke det samme) her:
http://www.webdesign101.dk/javascript/eksempler/eksempel4.php


Med venlig hilsen
--
Dennis Munding
Web-master
http://www.skovaa-munding.dk/, http://www.mundings-memorial.dk/
http://www.cantica.dk/, http://www.eds-denmark.dk/



Jørgen Farum Jensen (01-03-2006)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 01-03-06 17:49

Lars Petersen wrote:

> Mange tak for dit hurtige svar. Jeg er dog ked af det, men jeg ved ikke
> helt hvad jeg skal gøre med de tre "bidder". Jeg har oprettet et html-dok
> hvor første del er indsat. Anden del er lavet i et CSS hvortil der er
> linket fra html-siden. Jeg ved dog ikke hvad jeg skal gøre med "trigger"
> fuktionen? I "head" på html-dok? Har kigget lidt på din hjemmeside -
> temmeligt imponerende. Er der et sted derpå med en artikel omkring
> ovenstående som jeg kan læse i ro og mag? Mvh Lars
>

http://www.webdesign101.dk/javascript/eksempler/eksempel4.php

er det nærmeste, selvom den er lidt gammel, er princippet det samme.

Et javascript som dette skal indsættes i websidens head-del.

--

Med venlig hilsen

Jørgen Farum Jensen
http://www.webdesign101.dk
..

Søg
Reklame
Statistik
Spørgsmål : 177558
Tips : 31968
Nyheder : 719565
Indlæg : 6408929
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste