Gå til innhold

Skalerende bakgrunner i html


Anbefalte innlegg

Jeg driver med en side som jeg nå har kommet langt med. Men jeg har ett problem: Jeg vil selvfølgelig at siden skal se noenlunde lik ut på alle skjermstørrelser, og lagde et 4*4 table, med bakgrunner i hvert av cellene, men et iframe i den nederst til høyre.

 

Det jeg ønsker, er at bakgrunnene "strekker" seg etter tabellen, så uansett hvilken størrelse (Jeg satte width til %) tabellen er, så skal bakgrunnen strekke seg etter denne....

 

Jeg vet at enkelte her hater frames og tables, men dette er da måten jeg foretrekker å holde orden på. :innocent:

 

Jeg vet at jeg enkelt kunne løse problemet med å lage menyen i flash, men det synes jeg virker litt amatørmessig, og imagemapping, er det bare rot med...

 

Takker på forhånd for alle svar :thumbup:

Lenke til kommentar
Videoannonse
Annonse

Dette var vel ikke svarene jeg lette etter, var det vel? :no:

 

Jeg er en person som søker råd. For å si det slik, hjalp det absolutt ingenting å si at jeg gjør alt feil. Temaet kalles konstruktiv kritikk. Jeg er relativt ny til HTML og CSS, og fremdeles villig til å lære. Å rakke ned på mine ideer og forsøk på å lage en enkel liten side, dedikert til familien min er litt trist. Jeg gjør så godt jeg kan....

 

Jeg trodde dette forumet var et sted hvor man kunne poste spørsmål og søke råd. :dontgetit:

Lenke til kommentar
Dette var vel ikke svarene jeg lette etter, var det vel?  :no:

 

Jeg er en person som søker råd. For å si det slik, hjalp det absolutt ingenting å si at jeg gjør alt feil. Temaet kalles konstruktiv kritikk.  Jeg er relativt ny til HTML og CSS, og fremdeles villig til å lære. Å rakke ned på mine ideer og forsøk på å lage en enkel liten side, dedikert til familien min er litt trist. Jeg gjør så godt jeg kan....

 

Jeg trodde dette forumet var et sted hvor man kunne poste spørsmål og søke råd.  :dontgetit:

Greit, var kanskje et tåpelig svar av meg, men står fortsatt på mitt.

 

Lær deg HTML og CSS, da blir alt veldig masse enklare. Å lære seg dette godt nok til å sette sammen ei enkel side er heller ingen vanskelig ting, og er gjort på et par timer med litt engasjement. http://www.htmldog.com er en fin plass å begynne.

 

Men som SirIce seier, det er ikkje mulig å strekke bakgrunner, og uansett vil jo bildekvaliteten berre bli dårlig av det (med mindre nettlesere begynner å støtte vektorbilder :p)

Derimot kan du repetere bilder ved hjelp av CSS, enten kun horisontalt, kun vertikalt, eller begge deler.

 

edit: det var på ingen måte meininga å vere frekk om du oppfatta det slik :)

Endret av arve87
Lenke til kommentar
Jeg trodde dette forumet var et sted hvor man kunne poste spørsmål og søke råd.  :dontgetit:

Rådet er, som arve prøvde å få frem, at man ikke driver med vranglære på dette forumet. Dersom du har lyst å lære det riktig, er ingenting bedre. Det vil tjene alle.

 

Har du lyst å lære, sjekk ut følgende nettsteder:

 

HTMLDog

W3Schools

 

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

 

Med bakgrunner, mener du da bakgrunnsbilder? Såvidt jeg vet er det ikke mulig å "strekke" bakgrunnsbilder vha denne metoden din, mulig jeg tar feil.

 

EDIT: Synco :ohmy:

Endret av PoleCat
Lenke til kommentar

Login-sida på routeren min bruker et javascript for å resize bakgrunnsbildet slik at det passer enhver oppløsning. Det lager dog et bilde som bruker hele skjermen, men jeg vil tro at du med litt triksing og sånt kunne ha fått det til å oppfylle dine behov.

 

<script language=javascript>
   NS4 = (document.layers);
   IE4 = (document.all);
imSRC= "login_pic.jpeg";
   function reDo() {
       if (IE4) {
           bgimage.width = document.body.clientWidth;
           bgimage.height = document.body.clientHeight;
       }
       else
           window.location.reload();
   };
   window.onresize = reDo;
   function makeIm() {
        if (NS4) {
           imStr = "<LAYER NAME='back' LEFT=0 TOP=0  ABOVE='content'>"
           + "<IMG SRC=" + imSRC;
           imStr += " HEIGHT=" + innerHeight;
           imStr += " WIDTH=" + innerWidth;
           imStr += "></LAYER>"
           + "<LAYER NAME='content' LEFT=0 TOP=0>";
       }
       else {
           winHgt = (IE4) ? document.body.clientHeight :  innerHeight;
           winWid = (IE4) ? document.body.clientWidth :  innerWidth;
           imStr = "<DIV ID='back'"
           + " STYLE='position:absolute;left:0;top:0;z-index:0'>"
           + "<IMG NAME='bgimage' BORDER=0 SRC=" + imSRC;
           imStr += " HEIGHT=" + winHgt;
           imStr += " WIDTH=" + winWid;
           imStr += "></DIV>";
           imStr += "<DIV ID='content' STYLE='position:absolute;z-index:1'>"
       }
     document.writeln(imStr);
   }
   makeIm();
   </script>

 

Jeg vil likevel si at jeg anbefaler deg ikke å bruke det. Jeg anbefaler deg heller ikke å bruke hverken tabeller til layout eller iframe.

 

 

 

EDIT: Kopirettighetene til scriptet tilhører nok Unex. Bruk det på eget ansvar.

Endret av Mikka
Lenke til kommentar
Det mest effektive er å laste siden via et server-side script (PHP eller Perl), som først detekterer hvilken oppløsning du bruker, og deretter laster riktig versjon av bakgrunnsbilde istedet for å resize.

Det er også tungvindt å lage femtifjorten versjoner av samme siden. Det vil også alltid være noen som bruker egendefinerte oppløsninger, og de vil du ikke rekke over.

 

Det tar også lenger tid for den som vil inn på siden, og det har mange negative følger blant annet ved tanke på søkemotorer.

Lenke til kommentar
Det mest effektive er å laste siden via et server-side script (PHP eller Perl), som først detekterer hvilken oppløsning du bruker, og deretter laster riktig versjon av bakgrunnsbilde istedet for å resize.

Det er også tungvindt å lage femtifjorten versjoner av samme siden. Det vil også alltid være noen som bruker egendefinerte oppløsninger, og de vil du ikke rekke over.

 

Det tar også lenger tid for den som vil inn på siden, og det har mange negative følger blant annet ved tanke på søkemotorer.

Kommer ann på hvordan du bygger opp scriptet.

 

- Tre fire versjoner dekker godt over 95% av potensielle besøkende, resterende får servert en standardversjon. Dessuten gjelder dette kun bakgrunnsbilde, resten av HTML koden genererer scriptet dynamisk etter behov.

 

- Lasting av sider tar ikke lengre tid, for når bildet først er lastet en gang så ligger det i cache mappen din, dessuten så fjerner du mye belastning fra serveren når den slipper å resize "on the fly".

 

- Problemet i fohold til søkemotorer omgår du lett, ved å laste scriptet via en index side som har frames, som innheholder nødvendige meta tags.

Endret av 356speedster
Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
  • Hvem er aktive   0 medlemmer

    • Ingen innloggede medlemmer aktive
×
×
  • Opprett ny...