O tutorial a seguir usa o mecanismo de Tweener (http://code.google.com/p/tweener/). As imagens incluídas nos arquivos de papéis de parede são tirado interfacelift.com

1. Crie um novo arquivo Flash ActionScript 3.0 e salve-o como slidingContent.fla. Defina o tamanho do documento de 800 x 450 pixels e a taxa de quadros para 30 fps. Precisamos de 3 camadas chamado "conteúdo", "menu" e "ações". Bloqueie a camada ações.




2. Selecione o conteúdo "camada" e importar as imagens para o palco. Coloque as imagens lado a lado, alinhados ao topo. Selecione todos e convertê-lo em um clipe de filme com o ponto de inscrição para o canto superior esquerdo. Dê o clipe de filme o nome de instância content_mc. Coloque o clipe de filme a fim de que um dos imagem está centrada no palco.
[center][img]http://../../imagens/coluna/2884//td_screenshot.jpg[/img][/center]



3. Em breve, o clipe de filme é de 450 pixels de altura x 3200 pixels de largura (4 imagens de 800 pixels de largura cada). Para cada imagem, precisamos determinar a coordenada x para os quais a imagem é centrada no palco. A coordenada x de cada imagem são os seguintes:
- 1 imagem (Hong Kong): 0px;
- 2 imagem (Londres):-800px;
- 3 imagem (Paris):-1600px;
- Imagem 4 (Nova York):-2400px;


4. Selecione a opção "menu" camada. Criar quatro elementos botões e convertê-los em clipe de filme que o nome de instância são hongkong_btn, london_btn paris_btn e newyork_btn.


5. Selecione a opção "acções" camada e abra o painel de ações. Para começar a importar as classes necessárias para utilizar o motor de Tweener. Em seguida declarar variáveis número que mantenha a coordenada X para se mover. Em seguida, armazenar cada botão em uma matriz, percorrer este array para adicionar um ouvinte de evento clique para cada um e definir suas buttonMode a verdade.
import caurina.transitions.*;

var hongkongX : Number = 0;
var londonX : Number = -800;
var parisX : Number = -1600;
var newyorkX : Number = -2400;

var buttons : Array = [hongkong_btn,london_btn,paris_btn,newyork_btn];

for (var i:int = 0; i< buttons.length ; i++){
	buttons[i].addEventListener(MouseEvent.CLICK,navigate);
	buttons[i].buttonMode = true;
}



6 motor. Navegar A função de definir a coordenada X para passar a dá-lo como parâmetro para a função que setTween simplesmente chamar o método de addTween o Tweener:
function navigate(event:MouseEvent):void{
	switch (event.target){
		case (hongkong_btn) : setTween(hongkongX);
		break;

		case (london_btn) : setTween(londonX);
		break;

		case (paris_btn)  : setTween(parisX);
		break;

		case (newyork_btn) : setTween(newyorkX);
		break;
	}
}

function setTween(tweenX:Number):void{
	Tweener.addTween(content_mc, {x:tweenX, time:1, transition:"easeInOutCubic"});
}



7. Todo o código é:
import caurina.transitions.*;

var hongkongX : Number = 0;
var londonX : Number = -800;
var parisX : Number = -1600;
var newyorkX : Number = -2400;

var buttons : Array = [hongkong_btn,london_btn,paris_btn,newyork_btn];

for (var i:int = 0; i< buttons.length ; i++){
	buttons[i].addEventListener(MouseEvent.CLICK,navigate);
	buttons[i].buttonMode = true;
}

function navigate(event:MouseEvent):void{
	switch (event.target){
		case (hongkong_btn) : setTween(hongkongX);
		break;

		case (london_btn) : setTween(londonX);
		break;

		case (paris_btn)  : setTween(parisX);
		break;

		case (newyork_btn) : setTween(newyorkX);
		break;
	}
}

function setTween(tweenX:Number):void{
	Tweener.addTween(content_mc, {x:tweenX, time:1, transition:"easeInOutCubic"});
}


Download do arquivo a seguir:
src_5.zip