×

关注微信公众号

免备案网站空间虚拟主机双线空间域名查询PS数码后期
photoshop互助课堂数百G视频教程下载英语培训机构初中英语如何学随时随地聆听大师开讲/课堂
酷素材!视频教程打包下手绘教程抠图教程路径专辑photoshop cs3视频教程
查看: 2323|回复: 13

flash做个图片从上往下流动,点击图片放大在点击放大的图片缩小,继续流动。

[复制链接]

该用户从未签到

发表于 2016-6-14 16:10:47 | 显示全部楼层 |阅读模式
帮帮忙怎么做?我菜鸟一个,谢谢1

该用户从未签到

 楼主| 发表于 2016-6-14 16:37:11 | 显示全部楼层
大神们出来帮帮忙 吧
回复 支持 反对

使用道具 举报

该用户从未签到

 楼主| 发表于 2016-6-15 10:37:45 | 显示全部楼层
想做个图片从上往下流动,点击图片放大,在点击放大的图片缩小,继续流动。
这个代码怎么写,谢谢
回复 支持 反对

使用道具 举报

该用户从未签到

 楼主| 发表于 2016-6-16 15:34:50 | 显示全部楼层

这个 TweenMax 类 不知道怎么弄,总出错

本帖最后由 hengyang0 于 2016-6-16 15:45 编辑

Flash as3.0制作图片无缝滚动 无限循环教程

在这个教程中,将学习如何创建一个无限循环的回廊。也可以制作成菜单。注意:这个实例需要 TweenMax 类,请把附件中的gs类库保存在fla同一目录下。

点击→附件:gs类库gs.rar下载

演示:



全屏欣赏(动画地址复制下载)

详细制作步骤:

准备6个100 × 100的图片

1、新建Flash 文件,设置属性: 500 × 200 ,背景黑色。

2、从菜单选择文件-> 导入-> 导入到舞台。选择你要使用的图片。图1:

制作图片无缝滚动 无限循环教程

3、垂直地对舞台的中心放置图片。平均、水平地隔开他们。使用对齐面板。图2、图3:

图片无缝滚动 无限循环教程

图片无缝滚动 无限循环教程

4、将图片转换成影片剪辑:单击舞台上最左边的图片转换成影片剪辑。命名为”My Image 1 ″而且设定注册点为居左中位置。

5、重复这个步骤,将其它的图片全部转换为影片剪辑。命名为 " My Image 2 ″ ",My Image 3 ″ ... 依此类推。图4:

制作图片无缝滚动 无限循环教程

现在你的库如图5:

制作图片无缝滚动 无限循环教程

6、双击”My Image 1″影片剪辑,进入My Image 1的编辑状态,添加 as图层。图6:

制作图片无缝滚动 无限循环教程

选中第1帧,在动作面板中输入代码:

//Import TweenMax

import gs.*;

//Set the initial state for this movie clip

TweenMax.to(this, 0.5, {alpha: 0.4});

//Add mouse over & out event listeners

this.addEventListener(MouseEvent.MOUSE_OVER, mouseOverHandler);

this.addEventListener(MouseEvent.MOUSE_OUT, mouseOutHandler);

//This function is called when mouse is over this movie clip

function mouseOverHandler(e:Event):void {

//Tween the alpha

TweenMax.to(this, 0.5, {alpha: 1});

}

//This function is called when mouse is out of this movie clip

function mouseOutHandler(e:Event):void {

//Tween the alpha

TweenMax.to(this, 0.5, {alpha: 0.4});

} 重复这个步骤到其它的影片剪辑。(当移动鼠标在一个图片上的时候,添加一个透明度效果。可以修改成放大或其它效果,自行的试验一下。)

7、前期工作已全部完成,现在开始创建无限循环。在主时间轴,选择所有的六个影片剪辑。将他们转换成影片剪辑,命名 " Gallery Images "。图7:

制作图片无缝滚动 无限循环教程

8、为了使图片有无限循环的效果,我们需要舞台上的 " Gallery Images " 影片剪辑的另一个实例。因此在舞台上复制(选中Gallery Images,按住Ctrl键拖拽)另外的一个 " Gallery Images " 影片剪辑,放置在第一个实例后面,使他们水平地排列。图8:

制作图片无缝滚动 无限循环教程

9、选中舞台上的 " Gallery Images " 影片剪辑的两个实例。将他们转换成影片剪辑,命名 " Infinite Gallery " 设定注册点为左居中。图9:

制作图片无缝滚动 无限循环教程

10、在属性面板填入实例名字 " infiniteGallery" 。

11、添加as层,打开动作面板输入代码: //Import TweenMax

import gs.*;

//Save the horizontal center

var centerX:Number = stage.stageWidth / 2;

//Save the width of the whole gallery

var galleryWidth:Number = infiniteGallery.width;

//Speed of the movement (calculated by the mouse position in the moveGallery() function)

var speed:Number = 0;

//Add an ENTER_FRAME listener for the animation

addEventListener(Event.ENTER_FRAME, moveGallery);

function moveGallery(e:Event):void {

//Calculate the new speed

speed = -(0.05 * (mouseX - centerX));

//Update the x coordinate

infiniteGallery.x+=speed;

//Check if we are too far on the right (no more stuff on the left edge)

if (infiniteGallery.x>0) {

//Update the gallery’s coordinates

infiniteGallery.x= (-galleryWidth/2);

}

//Check if we are too far on the left (no more stuff on the right edge)

if (infiniteGallery.x<(-galleryWidth/2)) {

//Update the gallery’s coordinates

infiniteGallery.x=0;

}

}

这一段代码负责无限循环。
回复 支持 反对

使用道具 举报

该用户从未签到

发表于 2018-9-24 17:52:56 | 显示全部楼层
难得一见的好帖
回复 支持 反对

使用道具 举报

该用户从未签到

发表于 2018-9-24 18:11:20 | 显示全部楼层
好帖就是要顶
回复 支持 反对

使用道具 举报

该用户从未签到

发表于 2018-9-24 18:20:05 | 显示全部楼层
楼主是超人
回复 支持 反对

使用道具 举报

该用户从未签到

发表于 2018-9-24 18:21:53 | 显示全部楼层
很好哦。。。
回复 支持 反对

使用道具 举报

该用户从未签到

发表于 2018-9-24 18:37:57 | 显示全部楼层
楼主我支持你
回复 支持 反对

使用道具 举报

该用户从未签到

发表于 2018-9-24 18:57:22 | 显示全部楼层
说的非常好
回复 支持 反对

使用道具 举报

该用户从未签到

发表于 2018-9-24 19:08:44 | 显示全部楼层
顶顶多好
回复 支持 反对

使用道具 举报

该用户从未签到

发表于 2018-9-24 19:28:42 | 显示全部楼层
学习了。。。
回复 支持 反对

使用道具 举报

该用户从未签到

发表于 2018-9-24 19:35:36 | 显示全部楼层
好帖子要收藏
回复 支持 反对

使用道具 举报

该用户从未签到

发表于 2018-9-24 19:43:04 | 显示全部楼层
不错不错
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | [免费注册]

本版积分规则