Notifikationer

Markér alle som læst Log ud

Keld Nielsen Professor

14. april 2003 - 11:03 Der er 31 kommentarer og
2 løsninger

baggrund efter skærmopløsning

Jeg kan sagtens lave skift af side efter skærmopløsningen via et javascript ... men jeg vil gerne kunne lave det via CSS.

Jeg har to forskellige baggrundillustrationer til henholdsvis 800 pixel bred, og en til 1024 og derover.

Kan man lave det i CSS ???

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 11:08 #1

ikke så vidt jeg ved :-)

Synes godt om

cdc Novice

14. april 2003 - 11:14 #2

nej, med du kan gøre dette: http://www.eksperten.dk/spm/338014 se i bunden af spm.

Synes godt om

Keld Nielsen Professor

14. april 2003 - 11:46 #3

-> /cdc: jeg har prøvet scriptet, se her:

<script type="text/javascript">

var width = screen.width;
if (width == 800) {
document.write('<body style="background-image:url('top800.gif');background-repeat:no-repeat;">')
}
else if (width == 1024) {
document.write('<body style="background-image:url('topstor.gif');background-repeat: no-repeat;">')
}

</script>

men får en fejl om manglende ')' i første document.write linie ????

Synes godt om

cdc Novice

14. april 2003 - 11:52 #4

document.write('<body style="background-image: url(\'http://www.eksperten.dk/img/eksperten_logo.gif\'); background-repeat: no-repeat">')

Har ikke selv testet den med skriv denne linie som jeg kan se det

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 12:11 #5

Prøv det her.

<script type="text/javascript">

var width = screen.width;
if (width == 800) {
document.write("<body style=\"background-image:url('top800.gif');background-repeat: no-repeat;\"")
}
else if (width == 1024) {
document.write("<body style=\"background-image:url('topstor.gif');background-repeat: no-repeat;\"")
}

</script>

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 12:12 #6

Vær altid meget omhyggelig med hvordan du sætter dine ' og "

Synes godt om

Keld Nielsen Professor

14. april 2003 - 12:17 #7

uden at teste det ...mangler der så ikke et par >'er, og \ skal vel heller ikke med ???

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 12:21 #8

Du er med på at det eneste scriptet gør er at finde opløsningen og sætte body tagget ind med den rigtige style ikk'

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 12:21 #9

\ er en ecape

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 12:23 #10

Der burde i midlertid være et ; til sidst :-)

document.write("<body style=\"background-image:url('top800.gif');background-repeat: no-repeat;\"");

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 12:24 #11

Du har jo ret :-)

document.write("<body style=\"background-image:url('top800.gif');background-repeat: no-repeat;\">");

Synes godt om

cdc Novice

14. april 2003 - 12:24 #12

mikmakmuk du afslutter ikke body med >

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 12:27 #13

så skulle det være rigtigt. Hvis du vil være sikker på at det du laver opfylder de gældende standarter kan det anbefales at validerer din kode her http://www.w3.org/

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 12:30 #14

--> cdc Hvorfor ikke det?

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 12:38 #15

<html>
<head>
</head>
<script type="text/javascript">

var width = screen.width;
if (width == 800) {
document.write("<body style=\"background-image:url('top800.gif');background-repeat: no-repeat;\">");
}
else if (width == 1024) {
document.write("<body style=\"background-image:url('topstor.gif');background-repeat: no-repeat;\">");
}

</script>
</body>
</html>

Synes godt om

cdc Novice

14. april 2003 - 13:02 #16

du gjorde det 5 sec før jeg skrev det

Synes godt om

Keld Nielsen Professor

14. april 2003 - 13:35 #17

fandt en fejl:
document.write("<body style=background-image:url('top800.gif');background-repeat: no-repeat;>");

der skal ikke være " foran bacground-image

...men den tester jo på skærmstørrelse, ikke browser-størrelsen (jeg ved godt det var det jeg skrev fra starten ...men kan den teste på browser-størrelsen, og så forresten centrer billedet ???

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 13:46 #18

Der er altså ikke en fejl :-) Det kan godt være at det virker, men hvis det skal være helt korrekt så skal det være:
style="background-image:url('top800.gif');background-repeat: no-repeat;"

grunden til at der står

style=\"background-image:url('top800.gif');background-repeat: no-repeat;\"

er fordi du skriver det du via document.write. Så er du nødsaget til at ecape pingerne.

Synes godt om

Keld Nielsen Professor

14. april 2003 - 13:56 #19

OK, jeg er absolut ikke skrap til javascript ...det var bare min GoLive der skældte ud.

Har du en løsning på det andet jeg nævnte ???

Synes godt om

mik28 Seniormester

14. april 2003 - 14:00 #20

Hvad mener du med browser størrelsen? Mener du størelsen af det vindue som siden åbner i?

Synes godt om

Keld Nielsen Professor

14. april 2003 - 14:05 #21

Ja, hvis du har en stor skærmopløsning, er det jo tit du ikke ønsker at have din browser i fuld-skærm-opløsning, og derfor normalt bruger en mindre browserstørrelse.

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 14:14 #22

Jeg er ikke med på hvad det er du vil, sorry.

I forbindelse med at centrerer baggrundsbilledet (jeg går ud fra du mener både vertikalt og horisontalt) så skriver du

document.write("<body style=\"background-image:url('top800.gif');background-repeat: no-repeat;background-position: 50% 50%;\">");

Synes godt om

Keld Nielsen Professor

14. april 2003 - 14:22 #23

OK det er forståeligt, ikke hvad jeg skriver, men at du er lidt forvirret!

Jeg er foreløbelig her:

<script type="text/javascript">

if (document.body.clientWidth < 800) {
document.write("<body style=\"background-image:url('top800.gif');background-repeat: no-repeat;\">");
}
if (document.body.clientWidth == 800) {
document.write("<body style=\"background-image:url('top800.gif');background-repeat: no-repeat;\">");
}
else if (document.body.clientWidth > 800) {
document.write("<body style=\"background-image:url('topstor.gif');background-repeat: no-repeat;\">")
}

</script>

Det jeg nu mangler er en funktion til at centrer billederne, som CSS's align:center.

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 14:24 #24

background-position: 50% 50%;

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 14:31 #25

Hvorfor skriver du ikke bare

if (document.body.clientWidth <= 800) {
document.write("<body style=\"background-image:url('top800.gif');background-repeat: no-repeat;background-position: 50% 50%;\">");
}
else if (document.body.clientWidth >= 1024) {
document.write("<body style=\"background-image:url('topstor.gif');background-repeat: no-repeat;background-position: 50% 50%;\">")
}

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 14:48 #26

Jeg kan ikke hjælpe dig hvis det du vil er at få baggrunden til at passe med størrelsen på det vindue dit site er åbnet i, i en eller anden browser. Det eneste jeg kan gøre for dig er at bestemme om skærmopløsningen er over eller under 800px også bruge 2 forskellige baggrunde og centrere dem.

<script type="text/javascript">

var test = window.screen.availWidth;
if (test <= 800) {
document.write("<body style=\"background-image:url('top800.gif');background-repeat: no-repeat;background-position: 50% 50%;\">");

}
else if (test >= 800) {
document.write("<body style=\"background-image:url('topstor.gif');background-repeat: no-repeat;background-position: 50% 50%;\">")
}

</script>

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 14:49 #27

det skal være
else if (test > 800) {

Synes godt om

Keld Nielsen Professor

14. april 2003 - 14:56 #28

hej mikmakmuk

Det er flot det du har gjort indtil nu!

Af mærkelig årsager vil grafikken ikke centrer ligesom man kan i CSS, jeg fatter det ikke, har prøvet med både din løsning og "center top" det virker bare ikke.

Baggrunden top800.gif er 800 pixels bred mens topstor.gif er 1200 pixels bred, så det burde virke.

Hvis det ikke umiddelbar hjælper dig sig jeg på forhånd tak ...og smider nogle velfortjente point.

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 14:59 #29

det er jo CSS du bruger :-)

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 15:02 #30

Hvis du vil have det "center top"
background-position: 50% 0%;

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 15:04 #31

hvilken opløsning kører du med?

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 15:07 #32

hvis du kører med 1024 så vælger den jo billedet som er 1200px bredt. Det kan du ikke centrerer

Synes godt om

mikmakmuk Nybegynder

14. april 2003 - 15:09 #33

Hmmm, det var noget vrøvl jeg fik sagt der :-) Du kan selvfølgelig godt centrerer det. Du ser så bare kun det der er plads til

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML	18	10/09/202515:07	17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML	3	19/03/202522:16	20/03/202513:04
Se og ændre html på en webside Af magger i HTML	4	11/03/202513:55	12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML	5	02/03/202520:05	04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML	3	30/10/202409:37	01/01/202515:27

Se alle spørgsmål i kategorien Opret spørgsmål

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

Alle kategorier på Eksperten

Seneste artiklerRSS