/ 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
window.billede.width og height virker ikke~
Fra : Lars Hjortø


Dato : 17-12-03 21:15

Hejsa...

Jeg har lavet noget javascript der skulle resize et vindue, men jeg kan ikke
få skidtet til at virke ordenligt.

I head har jeg disse variabler:

var EkstraBredde=+27; /*Bredden af rammen på browser*/
var EkstraHoejde=+115; /*Højden af rammen på browser plus tekst nederst
i vinduet*/

Og følgende kode i body:

<img src="dummy.jpg" name="Billede">

<script language="javascript">

Billede.src = BilledArray[VistBillede];

/*følgende to linier er til "debugging"*/

window.alert(Billede.width);
window.alert(Billede.height);

billedBredde=+Billede.width+EkstraBredde;
billedHoejde=+Billede.height+EkstraHoejde;

window.resizeTo(billedBredde,billedHoejde);

</script>

Når jeg åbner vinduet bliver billedet vist som det skal, men det bliver ikke
resizet rigtigt.... I de to window.alert kan jeg se at det er bredde og
højde der ikke returneres rigtigt. Hvad f... er der galt? Gør jeg noget helt
forkert, eller burde jeg lave det på en helt anden måde?

Venlig hilsen Lars.

--
Fjern nospam fra min mailadresse hvis du vil skrive til mig.



 
 
Lasse Reichstein Nie~ (17-12-2003)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 17-12-03 23:56

"Lars Hjortø" <lars.hjortoe@nospampost2.tele.dk> writes:

> <script language="javascript">

<script type="text/javascript">

type-attributten er påkrævet i HTML 4, og tilstrækkelig i
alle versioner af HTML.

> Billede.src = BilledArray[VistBillede];
>
> /*følgende to linier er til "debugging"*/
>
> window.alert(Billede.width);
> window.alert(Billede.height);

Du skal vente på at billedet er blevet læst færdigt. Det kan
tage et stykke tid fra du sætter src-egenskaben.
Du kan få udført kode når billedet er loadet, ved at bruge onload-
event-handleren.

Prøv:
---
var Billede = document.images['Billede']; // så virker det i Mozilla
var EkstraBredde = 27; /* Bredden af rammen på browser */
var EkstraHoejde = 115; /* Højden af rammen på browser plus
tekst nederst i vinduet */
Billede.onload = function () {
var billedBredde = Billede.width + EkstraBredde;
var billedHoejde = Billede.height + EkstraHoejde;
window.resizeTo(billedBredde,billedHoejde);
}
Billede.src = BilledArray[VistBillede];
---

Du skal også lige overveje hvor god du er til at gætte højden og
bredden af rammen på *min* browser (held og lykke!)

Dit problem er at window.resizeTo sætter browserens *ydre* mål, mens
dit billede selvfølgelig skal bruge de indre mål. Man kan lave en
resize der baserer sig på de indre mål:

---
function resizeInnerTo(x,y) {
var innerWidth = window.innerWidth ||
(document.documentElement||document.body).clientWidth;
var innerHeight = window.innerHeight ||
(document.documentElement||document.body).clientHeight;
var dx = x - innerWidth;
var dy = y - innerHeight;
window.resizeBy(dx,dy);
}
---

De indre mål er *inklusive* scrollbaren i Mozilla, men kun inklusive
den vandrette scrollbar i IE, så sørg for at der er plads nok til
indeholdet, så der ikke er brug for en scrollbar (IE vil altid vise
den lodrette)

/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

Lars Hjortø (18-12-2003)
Kommentar
Fra : Lars Hjortø


Dato : 18-12-03 18:47

"Lasse Reichstein Nielsen" <lrn@hotpop.com> skrev i en meddelelse
news:ad5ryrxk.fsf@hotpop.com...
> "Lars Hjortø" <lars.hjortoe@nospampost2.tele.dk> writes:
>
> > <script language="javascript">
>
> <script type="text/javascript">
>
> type-attributten er påkrævet i HTML 4, og tilstrækkelig i
> alle versioner af HTML.
>

Mener du hermed at det ikke er nok at skrive:
<script language="javascript">
men der skal skrives:
<script type="text/javascript">
eller hvordan skal det forståes?

> > Billede.src = BilledArray[VistBillede];
> >
> > /*følgende to linier er til "debugging"*/
> >
> > window.alert(Billede.width);
> > window.alert(Billede.height);
>
> Du skal vente på at billedet er blevet læst færdigt. Det kan
> tage et stykke tid fra du sætter src-egenskaben.
> Du kan få udført kode når billedet er loadet, ved at bruge onload-
> event-handleren.
>
> Prøv:
> ---
> var Billede = document.images['Billede']; // så virker det i Mozilla

Det kunne jeg ikke lige få til at virke, hvor skal det stå? Browseren
skriver at Billede er null eller ikke et objekt.

> var EkstraBredde = 27; /* Bredden af rammen på browser */
> var EkstraHoejde = 115; /* Højden af rammen på browser plus
> tekst nederst i vinduet */
> Billede.onload = function () {
> var billedBredde = Billede.width + EkstraBredde;
> var billedHoejde = Billede.height + EkstraHoejde;
> window.resizeTo(billedBredde,billedHoejde);
> }
> Billede.src = BilledArray[VistBillede];
> ---

Og det virker bare... Når man har grunden til hvorfor et eller andet ikke
virker er det somme tider så nærliggende at man selv burde have gennemskuet
det.

> Du skal også lige overveje hvor god du er til at gætte højden og
> bredden af rammen på *min* browser (held og lykke!)
>
> Dit problem er at window.resizeTo sætter browserens *ydre* mål, mens
> dit billede selvfølgelig skal bruge de indre mål. Man kan lave en
> resize der baserer sig på de indre mål:

Ja, det ved jeg, men koden står i et vindue der åbnes med:

window.open("visbillede.htm?"+searchstring,"displaywindow","toolbar=no,scrol
lbars=no,status=no,resizable=yes")

så der er ingen scroll-bar eller andre sære ting. Men jeg skal have prøvet
med forskellige andre browsere for at se hvordan det ter sig...

> ---
> function resizeInnerTo(x,y) {
> var innerWidth = window.innerWidth ||
> (document.documentElement||document.body).clientWidth;
> var innerHeight = window.innerHeight ||
> (document.documentElement||document.body).clientHeight;
> var dx = x - innerWidth;
> var dy = y - innerHeight;
> window.resizeBy(dx,dy);
> }

Er problemet her ikke bare at window.innerWidth ikke virker i IE? Eller
tager jeg fejl.

Jeg er ret ny udi javascript, så jeg vil gerne lave noget der er så simpelt
som muligt uden at skulle tage hensyn til hvad browser folk bruger. Men
selvfølgelig, det kan være jeg bliver tvunget til det inden ret længe hvis
jeg ikke kan få det til at virke på andre måder.
Det jeg er i gang med er en form for "billedfremviser" hvor jeg kun skal
ændre i et par tekstfiler for at ændre de billeder der bliver vist, og der
var egenligt kun det ovenstående jeg ikke rigtigt havde kunne få til at
virke ordenligt, men det har jeg rimeligt styr på nu, i det mindste i IE....
(Ja ja, har lidt på fornemmelsen at IE er et fy-ord for dig, men tilgiv mig,
thi jeg ved ikke bedre ..., ville også selv gerne bruge noget andet, men
synes der er mange sider der ikke virker ordenligt i andet end IE. Ja - og
så gør jeg gud hjælpe mig det samme selv, og laver koder der nok ikke virker
andre steder end i IE... )

> ---
>
> De indre mål er *inklusive* scrollbaren i Mozilla, men kun inklusive
> den vandrette scrollbar i IE, så sørg for at der er plads nok til
> indeholdet, så der ikke er brug for en scrollbar (IE vil altid vise
> den lodrette)
>

Men du skal i hvert fald have tak for hjælpen, nu kan jeg lige som komme
videre, så må jeg senere kigge på at rette diverse "skønhedsfejl"...

Venlig hilsen Lars.

--
Fjern nospam fra min mailadresse hvis du vil skrive til mig.



Lasse Reichstein Nie~ (18-12-2003)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 18-12-03 21:44

"Lars Hjortø" <lars.hjortoe@nospampost2.tele.dk> writes:

> Mener du hermed at det ikke er nok at skrive:
> <script language="javascript">
> men der skal skrives:
> <script type="text/javascript">
> eller hvordan skal det forståes?

Ja. Hvis du vil skrive korrekt HTML 4, så *skal* du have
type-attributten med. Hvis du har den, så kan du undvære
language-attributten, som også er "deprecated" (som jeg aldrig kan
oversætte, men det er ca. det modsatte af anbefalet).

>> var Billede = document.images['Billede']; // så virker det i Mozilla
>
> Det kunne jeg ikke lige få til at virke, hvor skal det stå? Browseren
> skriver at Billede er null eller ikke et objekt.

Foran resten af koden, som alt sammen skal skal stå *efter* img-tagget
(tror jeg, ikke testet).
Pointen er at du har et element <img name="Billede" ...>, og du blot
skriver "Billede" for at referere til det. Du antager altså at der er
en global Javascript-variabel med samme navn som "name" på billedet,
og som peger på det. Det gælder i IE, men ikke i fx Mozilla.

> Og det virker bare... Når man har grunden til hvorfor et eller andet ikke
> virker er det somme tider så nærliggende at man selv burde have gennemskuet
> det.

Som de siger, "20-20 hindsight" :)

>> Du skal også lige overveje hvor god du er til at gætte højden og
>> bredden af rammen på *min* browser (held og lykke!)
>>
>> Dit problem er at window.resizeTo sætter browserens *ydre* mål, mens
>> dit billede selvfølgelig skal bruge de indre mål. Man kan lave en
>> resize der baserer sig på de indre mål:
>
> Ja, det ved jeg, men koden står i et vindue der åbnes med:
>
> window.open("visbillede.htm?"+searchstring,"displaywindow","toolbar=no,scrol
> lbars=no,status=no,resizable=yes")
>
> så der er ingen scroll-bar eller andre sære ting. Men jeg skal have prøvet
> med forskellige andre browsere for at se hvordan det ter sig...

Prøv med nogle med sjove skins :)
Og som ikke tillader at man fjerner scrollbars, for den sags skyld :) Mozilla
kan sættes til at forhindre rigtigt mange ting!

>> var innerWidth = window.innerWidth ||
>> (document.documentElement||document.body).clientWidth;

> Er problemet her ikke bare at window.innerWidth ikke virker i IE? Eller
> tager jeg fejl.

Det gør det ikke, det er derfor den falder tilbage på clientWidth i stedet.
Hvis *det* heller ikke virker, så går det galt.

> Jeg er ret ny udi javascript, så jeg vil gerne lave noget der er så simpelt
> som muligt uden at skulle tage hensyn til hvad browser folk bruger.

Det er nemt, hvis du ikke kræver at det også virker. :)

Det er heller ikke helt rigtigt, fordi dine "magiske konstanter" (17
og 112) netop antager at folk bruger samme browser som dig (og at den
endda ser ligesådan ud).

Tricket er at tage øjde for at folk bruger forskellige browsere, uden
at bekymre sig om hvad det er for nogen. Jeg tester normalt min kode
i IE 6, Mozilla, Opera 7 og Netscape 4. Hvis det virker der, så er det
nok ikke helt ved siden af.
Jeg skriver dog aldrig kode der tjekker hvilken browser der bruges.
I stedet tjekker jeg bare om de ting jeg skal bruge, er der.

> Men selvfølgelig, det kan være jeg bliver tvunget til det inden ret
> længe hvis jeg ikke kan få det til at virke på andre måder.

Du kan også slække på kravene til udseendet. Web er ikke beregnet til
at designe ned til sidste pixel, men til at tilpasse sig brugeren.

> (Ja ja, har lidt på fornemmelsen at IE er et fy-ord for dig, men tilgiv mig,
> thi jeg ved ikke bedre ...,

Lidt. Det er ikke verdens bedste browser (den mangler en del i
standardunderstøttelse), men det der virkelig kan irritere mig er sider
der er designet til at virke i IE, og derfor fejler i browsere der faktisk
overholder standarderne. Jeg holder på at designe til standarderne først,
og så tilføje et par linjer for også at virke i IE.

> ville også selv gerne bruge noget andet, men synes der er mange
> sider der ikke virker ordenligt i andet end IE.

.... og jeg havde ikke engang læst den sætning før jeg skrev det
ovenstående :)

> Ja - og så gør jeg gud hjælpe mig det samme selv, og laver koder der
> nok ikke virker andre steder end i IE... )

Det er ok, hvis du har en målgruppe som kun bruger IE. Og indtil du
lærer at gøre det bedre :)
Indtil da vil du høre folk som mig prædike :)

Held og lykke
/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

Søg
Reklame
Statistik
Spørgsmål : 177552
Tips : 31968
Nyheder : 719565
Indlæg : 6408847
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste