full screen background

9 kommentarer

Har dit billede en kant, når du prewiever i standalone flashplayeren og/eller i browser?

Hvis det kun er i browseren kunne det være pagemargin i html, der ikke er sat til 0!
Det kunne også være at dit billede (bitmap?) ikke er beskåret rigtigt i kanterne.

Vender eventuelt tilbage med et fullscreen background eksempel senere, hvis ovenstående ikke hjælper.

Her er et eksempel class du kan bruge som document class for en fla fil.
Den tegner et baggrunds Sprite, der bliver i midten af Stage hele tiden, uanset størrelsen af din swf-fil.

Men husk at sætte publish settings for html, så dimentions = percent, og højde og bredde = 100% i stedet for et bestemt antal pixels. Du skal også sætte scale til "noScale" og Flash alignment til Top og Left.

package {
  import flash.display.*;
  import flash.events.*;
  import flash.system.Capabilities;
 
  public class FullscreenBg extends Sprite
  {
  private var _bg:Sprite;
    
  public function FullscreenBg() : void
  {
    loaderInfo.addEventListener(Event.INIT, initListener);
  }
    
  private function initListener(e:Event) : void
{
  stage.align = StageAlign.TOP_LEFT;
  stage.scaleMode = StageScaleMode.NO_SCALE;
  drawBg();
  stage.addEventListener(Event.RESIZE, stageResizeListener);
}
    
  private function drawBg() : void
  {
    _bg = new Sprite();
    var maxWidth:Number = Capabilities.screenResolutionX;
    var maxHeight:Number = Capabilities.screenResolutionY;
    
    // Tegn en centreret rectangle, der er lige så stor som brugerens skærm målt i pixels.
    _bg.graphics.beginFill(0x000055, 1.0);
    _bg.graphics.drawRect(maxWidth * -0.5, maxHeight * -0.5, maxWidth, maxHeight);
  
    // tegn en circle i midten.
    _bg.graphics.beginFill(0xFFFFFF, 1.0);
    _bg.graphics.drawCircle(0,0, 20);
 
    // Flyt den til midten af stage
    centerBg();
    
    addChild(_bg);
  }
 
  private function centerBg() : void
  {
    _bg.x = stage.stageWidth / 2;
    _bg.y = stage.stageHeight / 2;
  }
    
  private function stageResizeListener(e:Event) : void
  {
    centerBg();
  }
}
}

Når filen er "publisched", så tjek at din html side fx har denne lille stump CSS:

<STYLE TYPE="text/css">
<!--
body {
  margin-left: 0px;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 0px;
}
-->
</STYLE>

Tak for dit svar,

Jeg troede virkelig der var en anden måde (og nemmere) at gøre det? Jeg har sat det til 100%, left og top osv. men det jeg i virkeligheden leder efter er i stil med http://www.skillet.com/awake.php

Som du kan se, har de alt deres "content" til at ligge på midten, men de har også en baggrund der strækker sig helt ud til siderne. Det er lige præcis det jeg ønsker at opnå, og helst nemmest muligt da jeg ikke har SÅ meget forstand på flash (har arbejdet lidt on and off, så er lige på vej tilbage i kampen).

på forhånd tak

Her er en lille snippet der scalerer dit baggrunds billede proportionalt
og maincontent_mc det movieclip du har dit indhold i, forbliver centret på stagen.

Måske det kan hjælpe lidt.
Jeg har brugt koden på www.intocentury.com hvis du vil se den in action

stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align     = StageAlign.TOP_LEFT;  
 
function stageResizeHandler(e:Event):void
{
 
maincontent_mc.x=stage.stageWidth/2--maincontent_mc.width/2
maincontent_mc.x=stage.stageHeight/2-maincontent_mc.height/2
 
 
Bg_image_.width = stage.stageWidth;
Bg_image_.height = stage.stageHeight;
     
var reg2:Number = stage.stageWidth / 2-Bg_image_.width/2;
var reg1:Number = stage.stageHeight / 2-Bg_image_.height/2;
 
Bg_image_.x = reg2;
Bg_image_.y = reg1;
 
Bg_image_.scaleX <=Bg_image_.scaleY ? (Bg_image_.scaleX =Bg_image_.scaleY) : (Bg_image_.scaleY =Bg_image_.scaleX);
 
}
 
stage.addEventListener(Event.RESIZE, stageResizeHandler);

ARRRGH Chokoladen bidder www.freaktrick.com

okay, vil det så betyde jeg skal oprette alt mig content i én og samme MC for at koden virker? som det ser ud nu, kører jeg bare på forskellige lag for at dele mit content ud og gøre det nemmere for mig at redigere i det.

tak for svaret ellers! håber du kan hjælpe yderligere er nemlig igang med at opsætte en hjemmeside for en café.

Som det ser ud nu - www.cafe-marina.com = Siden er slet ikke færdig som du nok kan se, teksten og billederne har jeg ikke modtaget fra firmaet endnu, så har bare brugt nogen random standard nogen. Men som du nok kan se har jeg en sort kant, og ville godt bare have det blå bitmap jeg bruger som baggrund til at gå helt ud til kanterne, uden det rører ved mit content overhovedet.

mvh
jeppe

Hej
Du behøver ikke at have alt dit indhold i et og samme MC
det var bare for nemhedens skyld,
så var der kun det at tænke på når du resizer stagen.

du ville sagtens kunne have eksempelvis:

header_mc.x=stage.StageWidth/2-header.width/2
et_me.y=50
et_mc.x=200

osv osv i din resize funktion

ARRRGH Chokoladen bidder www.freaktrick.com

hey sorry for jeg først skriver nu, hårde tider på arbejde

Det skal siges jeg ikke er 100% inde i actionscript, langt fra rent faktisk. kunne noget engang i actionscript 2, men det er lang tid siden. Det kan da ikke passe macromedia ikke har udviklet en simpelt måde og få et bitmap billede til at fylde det hele ud, uden nogen effekt på resten af dit content?

www.cafe-marina.com - den hjemmeside jeg arbejder på - hvis du skulle gøre det, så simpelt som muligt, hvordan ville du så få baggrunden ud og dække det sorte? på forhånd mange tak.

Hej

Lige en ting, skal selve siden også skalere sige, eller skal den have en fast størrelse (altså teksten, menuerne osv)

Mvh
Jakob

Hm tja det må egentlig gerne være fast størelse. Jeg har set at på nuværende tidspunkt skalere den med browseren, hvilket egentlig ikke er smart hvis du sidder på en mindre skærm. Så kan teksten være svær at læse osv.

En dejlig nem måde ville være fantastisk mange tak!