sträckt bakgrundsbild i din MySpace-profil

sträckt bakgrundsbild i din MySpace-profil

söndag 8 mars, 2009

många människor tillbringar mycket tid att anpassa sin MySpace-profil. Det kan vara mycket roligt. En av de återkommande vanliga frågorna är hur man uppnår en sträckt bakgrundsbild på profilen. Jag har undersökt detta lite och hittat några lösningar. Ingen av dem är tyvärr helt perfekt, men de kan perfekt nog för dig.

Observera att det sträckta bakgrundsproblemet inte är begränsat till MySpace-sidor. Det är ett allmänt problem för alla webbsidor. Det finns ingen riktigt bra lösning på detta idag (våren 2009). Vi måste vänta på CSS3-fastighetsstöd i bakgrundsstorlek. Om du själv har full kontroll över webbsidan (som du inte är i MySpace-profiler), så finns det lösningar, se t. ex. About.com.

alla följande beskrivningar antar att du använder MySpace Profile 2.0.

lösning 1: Använd en stor bakgrundsbild

använd en bakgrundsbild som är tillräckligt stor för att fylla upp hela bakgrunden på de flesta bildskärmar.

fördelar

• ganska lätt

nackdelar

• du kommer aldrig aldrig hur stor tittarnas bildskärm är, så bilden kanske inte är tillräckligt stor ändå. Om du går för 1920×1200 täcker du åtminstone de nuvarande stora widescreen-skärmarna.
• ett annat problem är att du verkligen vill att specifika delar av bakgrunden ska vara synliga, så se till att dessa finns längst upp till vänster på bilden.
• eftersom din upplösning av bakgrundsbilden vanligtvis är ganska stor kan den inte vara värd på många populära webbhotell (detta inkluderar myspace själv och t.ex. flickr), eftersom de har en maximal gräns för upplösning, vanligtvis cirka 1027×768. Så du måste vara värd för bilden någon annanstans där upplösningen kan vara större.
  gör en Google-sökning på ”image hosting large size” för att hitta värdwebbplatser.

hur man

1. Ladda upp en tillräckligt stor bakgrundsbild (t.ex. 1920×1200) på en bild värd webbplats där stora bilder är tillåtna.
2. i din MySpace-profil aktivera profilen > anpassa profil.
3. Aktivera Utseende > Avancerad Redigering > Bakgrund.
   • ange webbadressen till platsen för värdbilden, t.ex.http://www.yoururl.com/images/myspacebg.jpg
   • se till att bläddra med sidan är inställd på Nej och
   • Repeat är inställd på repetera inte.
4. aktivera förhandsgranskningsknappen för att visa resultatet. Om nöjd Aktivera knappen Publicera.

lösning 2: Preliminärt CSS3-stöd

de flesta webbläsare idag (våren 2009) stöder inte egenskapen CSS3 bakgrundsstorlek. Om de gjorde alla problem med utsträckta bakgrunder skulle ha lösts. Men de flesta webbläsare som använder webkit-motorn har preliminärt stöd för fastigheten. Det täcker t.ex. webbläsarna Safari och Chrome.

fördelar

• ganska lätt
• kan använda någon bildstorlek, t.ex. några av dina egna profilbilder.
• gör korrekt storleksändring på bakgrunden. Men kanske inte nödvändigtvis ser bra ut på en ultra wide monitor.

nackdelar

• fungerar inte i Internet Explorer och i många andra webbläsare. Detta täcker de mest använda webbläsarna, så det är en stor nackdel.

hur

1. i din MySpace-profil aktivera profilen > anpassa profil.
2. aktivera utseende > CSS
3. ange följande CSS-kod-ersätt webbadressen med platsen för din bild:

body { background-image: url(http://www.yoururl.com/images/myspacebg.jpg); x-webkit-background-size:100% 100%;}

4. aktivera förhandsgranskningsknappen för att visa resultatet. Om nöjd Aktivera knappen Publicera.

lösning 3: injicera Img-element

den sista lösningen, som återigen inte är perfekt, handlar om att injicera ett HTML Img-element i din profil och sedan kontrollera dess position på sidan för att passa webbläsarfönstret.

fördelar

• kan arbeta med någon bildupplösning storlek, t.ex. en bild från din MySpace profil album.

nackdelar

• bilden rullar med sidan, så att bakgrunden inte är fixad. Detta är en stor nackdel.
• lite komplicerat att introducera i din profil.

hur man

1. i din MySpace-profil Aktivera profil > Redigera profil
2. på sidan Redigera profil aktivera Om mig.
3. i avsnittet Om mig anger du följande HTML-koder för att injicera Img-elementet som hänvisar till din bakgrundsbild. Src-attributet ska hänvisa till bilden.

<img width="100%" src="http://www.yoururl.com/images/myspacebg.jpg"/>

1. aktivera Spara ändringar för att spara dina ändringar.
2. Aktivera profil > anpassa profil
3. aktivera utseende > CSS
4. ange (Lägg till) följande CSS-kod-som i huvudsak kommer att placera den injicerade bilden (identifierad av) för att passa in i bakgrunden som sträckt:

#back{ width: 100%; height: 100%; left: 0px; top: 0px; position: absolute; z-index: -1;} 

5. aktivera förhandsgranskningsknappen för att visa resultatet. Om nöjd Aktivera knappen Publicera.