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

Kodeord


Reklame
Top 10 brugere
Java Scripts
#NavnPoint
molokyle 5410
Klaudi 2799
smorch 2439
kim 1360
Harlekin 1134
bentjuul 984
gibson 800
severino 695
Random 675
10  konsulent.. 626
Ny i JavaScript: Vis/skjul div
Fra : Anders M


Dato : 02-12-06 00:09

Hej kloge mennesker

Jeg har først for nylig kastet mig over JavaScript.

Jeg har fået fat i en funktion, der viser/skjuler en div, når man trykker på
et link.
Jeg har nuppet det fra
http://www.netlobo.com/div_hiding.html

Det ser ud som følger:

function toggleLayer(whichLayer) {
if (document.getElementById) {
// this is the way the standards work
var style2 = document.getElementById(whichLayer).style;
style2.display = style2.display? "":"block";
}
else if (document.all) {
// this is the way old msie versions work
var style2 = document.all[whichLayer].style;
style2.display = style2.display? "":"block";
}
else if (document.layers) {
// this is the way nn4 works
var style2 = document.layers[whichLayer].style;
style2.display = style2.display? "":"block";
}
}

Og tilsvarende CSS:

div#hallelujah {
padding:10px;
display: none;
}

Og tilsvarende HTML:

<h3><a href="javascript:toggleLayer('hallelujah');">Fisken er
forgiftet</a> - 12/11-2006</h3>
<div id="hallelujah">
<p>
Det forlyder at fisken var forgiftet med fluesvamp.
</p>
<p>
<a href="javascript:toggleLayer('nyhed_20');">Luk</a>
</p>
</div>


Men det virker (naturligvis) ikke, når Javascript er slået fra. Div'en vises
ikke, og der sker (naturligvis) ikke en skid, når man klikker på linket.
Det' dæl'me dumt...

Jeg kunne godt tænke mig, at div'en blev vist for folk, der ikke har slået
JavaScript til, ligesom åbne/lukke-links forsvinder, for i den situation
giver det ingen mening at have dem.

Er der nogen, der pædagogisk kan forklare mig hvordan jeg modificerer
eksisterende funktion til det?
Altså:
- Div'en skal vises, hvis JavaScript er slået fra.
- Div'en skal skjules som default, hvis Javascript er slået til.
- Åbne/lukke-links skal ikke være der, hvis Javascript er slået fra.

Mvh.
Anders M



 
 
Martin (02-12-2006)
Kommentar
Fra : Martin


Dato : 02-12-06 00:20

Anders M wrote:
> Og tilsvarende CSS:
>
> div#hallelujah {
> padding:10px;
> display: none;
> }

Ændrer display:none; til display:block
så starter teksten med at være fremme, og man kan så "lukke" det

Anders M (02-12-2006)
Kommentar
Fra : Anders M


Dato : 02-12-06 00:36


"Martin" <news@natten-i.dk> wrote in message
news:4570b897$0$49203$14726298@news.sunsite.dk...
> Anders M wrote:
>> Og tilsvarende CSS:
>>
>> div#hallelujah {
>> padding:10px;
>> display: none;
>> }
>
> Ændrer display:none; til display:block
> så starter teksten med at være fremme, og man kan så "lukke" det

Mjaaaarrrrh....
Så vises div'en fra start når Javascript er slået til.
Og der er stadig åbne/lukke-links når Javascript er slået fra.
Det var ikke meningen...

Med venlig hilsen
Anders M



Erik Ginnerskov (02-12-2006)
Kommentar
Fra : Erik Ginnerskov


Dato : 02-12-06 01:20

Anders M wrote:
> Hej kloge mennesker
>
> Jeg har først for nylig kastet mig over JavaScript.
>
> Jeg har fået fat i en funktion, der viser/skjuler en div, når man
> trykker på et link.

> Men det virker (naturligvis) ikke, når Javascript er slået fra.
> Div'en vises ikke, og der sker (naturligvis) ikke en skid, når man
> klikker på linket. Det' dæl'me dumt...

Du kan lave det i css alene - helt uden brug af javascript. Det går ud på,
at du ved klik på et link indlæser et ekstra css, som samtidig skifter
linket.

Du kan se det demonstreret her:

http://hjemmesideskolen.dk/html/elementer.asp?liststyle0.css

Hint: Linket 'Vis non-strict elementer'

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk/ - http://ginnerskov.dk/
http://html-faq.dk




Jens Gyldenkærne Cla~ (02-12-2006)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 02-12-06 23:53

Erik Ginnerskov skrev:

> Du kan lave det i css alene - helt uden brug af javascript.

Det er nærmere i html alene. Det er godt nok css-koden der skjuler
elementerne, men skiftet foretages via html (og det kan ikke gøres
med css, da css ikke kan reagere på klik).

> Det går ud på, at du ved klik på et link indlæser et ekstra
> css, som samtidig skifter linket.

Det er en langt tungere løsning end javascriptmodellen, da siden
skal indlæses igen. Selv om billeder mv. caches, er der tydelig
forskel på vis/skjul via javascript og vis/skjul via html/reload.
Arbejder man man formularer, skal en serverbaseret løsning desuden
håndtere gendannelse af formdata og evt. udkobling af validering -
mens javascriptløsningen kan "pille" ved siden uden at påvirke
formdata.

> http://hjemmesideskolen.dk/html/elementer.asp?liststyle0.css

Hvis man bruger serversidekode, er der i mine øjne ingen grund til
at placere elementer med html for så at fjerne dem med css. I
stedet for at kalde en css-fil, kunne asp-koden bare fjerne de
html-dele der ikke skal udskrives.

Personligt ville jeg dog foretrække en javascriptbaseret vis/skjul-
funktion - naturligvis lavet så siden ikke bliver ødelagt hvis
javascriptunderstøttelsen mangler.
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

Erik Ginnerskov (03-12-2006)
Kommentar
Fra : Erik Ginnerskov


Dato : 03-12-06 15:53

Jens Gyldenkærne Clausen wrote:

> Det er nærmere i html alene. Det er godt nok css-koden der skjuler
> elementerne, men skiftet foretages via html (og det kan ikke gøres
> med css, da css ikke kan reagere på klik).

Sådan kan man også anskue det. Det jeg mente var, at det er lavet uden brug
af javascript, hvilket Anders antydede et ønske om.

> Det er en langt tungere løsning end javascriptmodellen, da siden
> skal indlæses igen. Selv om billeder mv. caches, er der tydelig
> forskel på vis/skjul via javascript og vis/skjul via html/reload.

Det er rigtigt, men min side virker da ikke langsom i skiftet? Formålet med
den måde at gøre det på er, at en blokering for javascript-afvikling ikke
tager funktionaliteten ud af siden.

> Personligt ville jeg dog foretrække en javascriptbaseret vis/skjul-
> funktion - naturligvis lavet så siden ikke bliver ødelagt hvis
> javascriptunderstøttelsen mangler.

Det skulle i så fald være lavet, så intet er skjult, hvis
javascriptunderstøttelsen mangler. Men det var ikke det, der var ønsket.

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk/ - http://ginnerskov.dk/
http://html-faq.dk



Jens Gyldenkærne Cla~ (03-12-2006)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 03-12-06 16:53

Erik Ginnerskov skrev:

> Det er rigtigt, men min side virker da ikke langsom i skiftet?

Det kommer an på hvad man sammenligner med. Ifølge Load Time
Analyzer[1] tager det i snit lidt over 400 ms at skifte mellem vis og
skjul på din side (her går halvdelen af tiden dog med peak-counteren).
Det er ikke lang tid for at loade en selvstændig webside, men det er
lang tid at vente på reaktion fra en simpel knap. I et program der
ikke kører over nettet, ville man aldrig acceptere så lange svartider.

Sammenligner man skiftet med det eksempel Anders M selv fandt -
<http://lab.victoriac.net/showhide/index.html> - er
hastighedsforskellen tydelig, selv om jeg har et pænt stort hul til
nettet. Hvis siden ses via en ældre forbindelse, eller serveren er
belastet, vil forskellen blive endnu mere markant.

> Formålet med den måde at gøre det på er, at en blokering for
> javascript-afvikling ikke tager funktionaliteten ud af siden.

Hvis man kan leve med at de skjulte tekster bliver vist konstant
når javascript mangler, er der ikke noget funktionalitetsproblem
med javascriptløsningen. Men hvis det er væsentligt at man i alle
tilfælde kan skifte mellem "vist" og "skjult", er javascriptudgaven
ikke nok. Det er dog muligt at lave en anden form for fallback på
javascriptløsningen, så der alene skiftes via html/css når
javascript ikke er understøttet.


> Det skulle i så fald være lavet, så intet er skjult, hvis
> javascriptunderstøttelsen mangler.

Ja. Det er netop hvad løsningen på
<http://lab.victoriac.net/showhide/index.html> sørger for.

> Men det var ikke det, der var ønsket.

Øh - jo.

Fra det oprindelige indlæg:

,--------
| Jeg kunne godt tænke mig, at div'en blev vist for folk, der ikke
| har slået JavaScript til, ligesom åbne/lukke-links forsvinder, for
| i den situation giver det ingen mening at have dem.
`--------

Noter:
======

[1] <https://addons.mozilla.org/firefox/3371/>
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

Erik Ginnerskov (03-12-2006)
Kommentar
Fra : Erik Ginnerskov


Dato : 03-12-06 17:35

Jens Gyldenkærne Clausen wrote:

> Det kommer an på hvad man sammenligner med. Ifølge Load Time
> Analyzer[1] tager det i snit lidt over 400 ms at skifte mellem vis og
> skjul på din side (her går halvdelen af tiden dog med peak-counteren).

Det er med andre ord mindre end et halvt sekund. Nu sagde du ikke noget
præcist om din forbindelses hastighed. med min 512 Kb/s-forbindelse er det
knap trekvart sekund (734ms).

> Det er ikke lang tid for at loade en selvstændig webside, men det er
> lang tid at vente på reaktion fra en simpel knap. I et program der
> ikke kører over nettet, ville man aldrig acceptere så lange svartider.

Her må jeg nok lige indsparke en erkendelse: Efter at have studeret
kildekoden til min side nærmere, kan jeg konstatere, at det faktisk
involverer noget sap-kode også, for at fungere. Jeg beklarer, at jeg huskede
forkert og ikke ulejligede mig med at undersøge det nærmere inden mit første
indspark.

> [1] <https://addons.mozilla.org/firefox/3371/>

Den blev strakt tilføjet værktøjssamlingen.

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk/ - http://ginnerskov.dk/
http://html-faq.dk



Erik Ginnerskov (03-12-2006)
Kommentar
Fra : Erik Ginnerskov


Dato : 03-12-06 17:40

Erik Ginnerskov wrote:

> involverer noget sap-kode

Øh, hvaffer noget? Der skulle have stået asp-kode.

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk/ - http://ginnerskov.dk/
http://html-faq.dk



Jens Gyldenkærne Cla~ (03-12-2006)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 03-12-06 18:15

Erik Ginnerskov skrev:

> Det er med andre ord mindre end et halvt sekund.

Ja.

Min pointe er her at 1/2 sekund er en udmærket load-tid for en
webside, men lang tid at vente på at aktivere en funktion.


> Her må jeg nok lige indsparke en erkendelse: Efter at have
> studeret kildekoden til min side nærmere, kan jeg konstatere,
> at det faktisk involverer noget sap-kode også, for at fungere.

Hvilke ting udfører asp-koden?
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

Erik Ginnerskov (03-12-2006)
Kommentar
Fra : Erik Ginnerskov


Dato : 03-12-06 18:27

Jens Gyldenkærne Clausen wrote:

> Hvilke ting udfører asp-koden?

Jeg har dette script liggende over DTD:

<% Dim xStyle
If Request.QueryString( "xstyle" ) <> "" Then
xStyle= Request.QueryString( "xstyle" )
Else
xStyle = "hide0.css"
End If %>

Dertil har jeg lagt lidt asp ind i kaldet til css:

<link href="<%Response.Write xStyle%>" rel="stylesheet" type="text/css" />

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk/ - http://ginnerskov.dk/
http://html-faq.dk



Anders M (02-12-2006)
Kommentar
Fra : Anders M


Dato : 02-12-06 11:15

"Anders M" <a.mogensen@emailFJERNDETMEDSTORT.dk> wrote in message
news:4570b611$0$49196$14726298@news.sunsite.dk...
> Er der nogen, der pædagogisk kan forklare mig hvordan jeg modificerer
> eksisterende funktion til det?
> Altså:
> - Div'en skal vises, hvis JavaScript er slået fra.
> - Div'en skal skjules som default, hvis Javascript er slået til.
> - Åbne/lukke-links skal ikke være der, hvis Javascript er slået fra.

Pyt, jeg fandt umiddelbart en løsning på
http://lab.victoriac.net/showhide/index.html

Mvh.
Anders M



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

Månedens bedste
Årets bedste
Sidste års bedste