11 2012 档案

摘要:AdobeEdgeAnimate--异步条件加载框架(yepnop)应用之二:加载jQueryUI之日历(datepicker)版权声明:本文版权属于北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。下面在前面一个案例的基础上继续讲解第二个应用:一、设计好按钮和界面,如下图:命名与排列:其中btn_jqueryui内部元素:Frame_jqueryui内部元素:上方的方框为element1,下方的为element2二、为工程添加js和css文件,即jQueryUI的文件,下面会用到这些如何添加呢?从网上下载jquery-ui.min.js文件和jquery-ui.css文件,拷贝到 阅读全文
posted @ 2012-11-30 18:20 Adobe Edge 阅读(2237) 评论(2) 推荐(0)
摘要:AdobeEdgeAnimate--异步条件加载框架(yepnop)应用之一:加载GoogleMaps版权声明:本文版权属于北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。下面将使用一个案例为大家讲解如何使用异步条件加载框架(yepnop)一、创建工程并建立基本的一些工具,如下图:1.整体界面2.排布及命名,左侧按钮为元件:btn_googlemaps,右侧整个为元件:frame_googlemap3.btn_googlemaps内部元素:一个圆角长方形和文本4.frame_googlemap内部元素:map:用于显示地图圆角长方形:作为背景文本:GoogleMaps二、做完了这 阅读全文
posted @ 2012-11-30 15:11 Adobe Edge 阅读(2496) 评论(0) 推荐(0)
摘要:AdobeEdgeAnimate--音频文件的添加和播放控制版权声明:本文版权属于北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。使用Edge制作动画的时候,会遇到以下问题,声音文件怎么加载进来呢?即使加载进来了,发布的时候声音又没有了,这个该怎么办呢?以下将为大家讲解如何解决上述问题。为工程添加音频文件:1.如图,首先将音频放置到工程文件目录下sound文件夹,当然你也可以用audio之类的别的名字:2.在时间线上0秒处,插入触发器(InsertTrigger),填写你的代码varau_to_play=newAudio();//申请一个动态内存存放音频文件,这个变量已经成为全局 阅读全文
posted @ 2012-11-27 17:57 Adobe Edge 阅读(6300) 评论(0) 推荐(1)
摘要:[原创]AdobeEdgeAnimate1.0--创建按钮及简单功能实现版权声明:本文版权属于北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。以下为大家讲解如何使用Edge制作一个简单的按钮动画,使用到的方法:--Edge动画编辑--简单的按钮制作--对按钮添加Javascript控制代码一、制作按钮:1.使用Edge的圆角长方形(RoundRectangle)制作一个按钮图形2.接下来添加文字3.选中长方形和文字,将他们转换为元件4.将元件的鼠标手势修改为小手,这样当我们的鼠标移动到元件上方的时候鼠标指针变为小手,提示我们这是个按钮。5.接下来我们为按钮添加代码,比如说,当我们 阅读全文
posted @ 2012-11-27 12:41 Adobe Edge 阅读(10071) 评论(6) 推荐(2)
摘要:[原创]AdobeEdgeAnimate1.0--使用GoogleWebFonts版权声明:本文版权属于 北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。AdobeEdgeAnimate提供了让用户自主添加字体的功能,分别为:1.添加本地字体2.添加GoogleWebFonts3.添加TypeKit字体以下我们将为大家详细讲解如何在Edge中添加GoogleWebFonts:注:GoogleWebFonts上面有好几百种字体,不过基本都是英文的字体。1.如下图,我们先使用文本工具“T”添加一段字体点击资源库面板中字体右侧的加号,打开导入字体的对话框;这里要填写什么内容呢?当然是G 阅读全文
posted @ 2012-11-27 09:41 Adobe Edge 阅读(2314) 评论(0) 推荐(1)
摘要:AdobeEdgeAnimate1.0--使用JavaScript添加交互功能版权声明:本文版权属于 北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。你可以使用JavaScript对工程添加交互功能,你可以对每一个元素定义动作控制函数,直接使用Edge内置的代码编辑器和代码库片段即可。每一个单独的处理事件都可以通过添加一个动作控制函数实现。一、定义动作控制函数:1.如图,在时间线上,点击你想要添加代码的元素左侧按钮,打开代码编辑器。你也可以在元素面板中打开代码编辑器。2.选择一种事件触发机制。代码编辑器左侧是代码编辑区域,右侧则是代码片段列表,只要点击相应的按钮,就可以自动添加代 阅读全文
posted @ 2012-11-26 16:19 Adobe Edge 阅读(3762) 评论(0) 推荐(0)
摘要:AdobeEdgeAnimate1.0--发布到旧版本的浏览器版权声明:本文版权属于 北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。AdobeEdgeAnimate使用web网页标准来制定动画和交互功能,如HTML5,CSS3和JavaScript。由于旧版本的浏览器不支持这些标准,所以可能会出现部分功能无法出现和运作的情况。但是即便如此,你还是可以通过创建“海报”(posterimage)来发布到旧版本的浏览器,你也可以通过使用谷歌浏览器内嵌框架(GoogleChromeFrameextension),这个框架是用于Windows操作系统上IE浏览器的。一、使用“海报”使你发 阅读全文
posted @ 2012-11-26 15:28 Adobe Edge 阅读(1153) 评论(0) 推荐(0)
摘要:AdobeEdgeAnimate1.0--在Edge中创建一个Logo动画版权声明:本文版权属于 北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。用到的技术方法:---径向擦除(旋转遮盖层,显示出被遮盖的logo)---文本和文字下落时候的缓冲(Easing)---循环(Looping)一、创建径向擦除效果:1.创建一个新工程,保存。在属性面板中,改变Overflow属性为Hidden。2.设置参考线,如从标尺(Ruler)中拖动一条垂直参考线懂啊275px位置,拖动一条水平参考线到200px位置。3.导入素材,并且参照以下截图将元素在舞台中放置,特别注意层叠关系。设置擦除效果: 阅读全文
posted @ 2012-11-26 14:35 Adobe Edge 阅读(2151) 评论(0) 推荐(0)
摘要:AdobeEdgeAnimate1.0--使用元件创建嵌套动画版权声明:本文版权属于 北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。假如你想创建一个嵌套动画,这个动画有自己单独的时间线和交互功能,那么元件(Symbols)就是一个很好的选择。元件在舞台时间线上显示为一个元素,但是这个元素有属于自己的时间线,在舞台上你可以像平常元素一样对它进行编辑动画,比如让它从左边移动到右边;你也可以进入这个元件,对它包含的元素进行编辑。换言之,你可以在一个动画中创建另一个动画。元件(Symbols)是可重复使用的,一旦你创建了一个元件,它就会出现在你的资源库列表中,只要拖动元件到舞台即可。也 阅读全文
posted @ 2012-11-26 11:18 Adobe Edge 阅读(2475) 评论(0) 推荐(0)
摘要:AdobeEdgeAnimate1.0--对已有的HTML文件进行动画编辑版权声明:本文版权属于 北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。你可以对现有的HTML文件进行动画编辑和添加交互性元素,由于EdgeAnimate生成的动画代码存储在一个单独的文件中,这保证了HTML页面的完整性。1.在Edge中打开现有的HTML页面(File-->Open)。EdgeAnimate只能打开符合标准的代码。比如,如果HTML文件有重复的ID,那么它会提示你文件有重复的ID,不会打开这个文件。假如出现以上情况,请在其他HTML验证器中打开运行。2.在舞台中选择一个页面元素。你也 阅读全文
posted @ 2012-11-23 18:02 Adobe Edge 阅读(1601) 评论(0) 推荐(0)
摘要:AdobeEdgeAnimate1.0--使用Web字体版权声明:本文版权属于 北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。只要你拥有可置入的字体编码,你就可以在EdgeAnimate中使用任意一种字体。如果使用的字体需要正确配置,在加载这种字体进入EdgeAnimate之前,请确认字体编码已经正确配置为离线或者托管查看。加载字体类型包括:1.AdobeTypekit2.Google字体3.本地字体文件加载web字体:1.点击资源库面板中Fonts后面的“+”按钮2.粘贴web字体供应者提供的CSS代码,详细CSS代码使用将在后续文章中涉及。你也可以提供一个字体的福冈列表。原 阅读全文
posted @ 2012-11-23 17:25 Adobe Edge 阅读(1503) 评论(0) 推荐(0)
摘要:AdobeEdgeAnimate1.0--创建动画:版权声明:本文版权属于 北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。在EdgeAnimate,你可以用基于创建关键帧的传统方法来创建动画,此外,EdgeAnimate也提供另外一种基于“别针标记”(以下称标记)的方法来创建关键帧。一、使用标记工具创建动画标记工具能够适时记录所在时间点的元素属性值。当你做了编辑修改时,播放头处的属性值会发生改变,而标记工具则会在所在时间点处记录更改前元素的属性值,EdgeAnimate会自动生成关键帧和介于标记工具和播放头之间的动画。下面我们讲述如何使用标记工具制作动画:1.限定在时间线上适时 阅读全文
posted @ 2012-11-23 16:44 Adobe Edge 阅读(1606) 评论(0) 推荐(1)
摘要:AdobeEdgeAnimate对图形格式的支持和各种图形格式的区别版权声明:本文版权属于 北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。一、概述当你做好了一张图片,想要把它用于EdgeAnimate中时,纠结了……图片格式这么多,到底选择哪一种格式导出呢?不要担心,EdgeAnimate支持PNG,GIF,JPG和SVG格式的图片。接下来将为大家详解各种格式类型之间的区别,在哪种情况下要用哪一种格式类型。以下截图显示的是不同格式类型保存的同一张图片(带Alpha通道):二、JPEGJPEG(或JPG)格式的图形比PNG格式的图形具有更高的压缩率,它的文件大小更小。当你不需要图 阅读全文
posted @ 2012-11-23 14:52 Adobe Edge 阅读(3395) 评论(0) 推荐(0)
摘要:软件内部教程:版权声明:本文版权属于 北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。AdobeEdgeAnimate内部的教程面板提供了一些实践教程,这些教程包含着实例资源文件,有了这些文件,结合Edge的工具,你就可以轻松跟着教程学习AdobeEdge了。以下是教程面板的截图:你可以通过主界面的GettingStarted直接进入课程面板,也可以通过窗口菜单(Window-->Lessons)访问。原文地址:http://helpx.adobe.com/content/help/en/edge-animate/using/lessons.html本文地址:http:// 阅读全文
posted @ 2012-11-23 11:10 Adobe Edge 阅读(2312) 评论(0) 推荐(0)
摘要:发布你的内容:版权声明:本文版权属于 北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。一、优化发布到web的内容:1.选择File-->PublishSettings2.在发布设置(PublishSettings)对话框中,确认Web被选为发布对象(PublishTarget)。3.查看或改变输出目标路径(TargetDirectory)4.设置通过CDN优化框架(FrameworksviaCDN)如果选择了这个功能,则会从内容分发网络(CDN)上下载与工程相关的jQuery库资源文件。如果不选择这个功能,工程的资源文件则会被打包发布。5.设置发布内容为静态的HTML如果选 阅读全文
posted @ 2012-11-23 10:48 Adobe Edge 阅读(1224) 评论(0) 推荐(0)
摘要:AdobeEdgeAnimate1.0概述版权声明:本文版权属于 北京联友天下科技发展有限公司。转载的时候请注明版权和原文地址。一、主界面从主界面我们可以直接进入:1.工程操作(ProjectCommands):打开之前保存的工程(OpenFile...)或者新建一个工程(CreateNew...);2.从最近使用文件列表中(RecentFiles...)可以打开最近保存的工程;3.软件内置课程资源标签(GettingStatred),软件主要特性(KeyFeatures),相关资源(Resources)4.另外还有一些国内可能用不到的东西:Facebook和Twitter社交媒体二、软件官方 阅读全文
posted @ 2012-11-23 10:32 Adobe Edge 阅读(5465) 评论(0) 推荐(3)
摘要:目录入门遇见明星:她就是Rahko!延伸阅读要求必备知识对创建交互式动画感兴趣。其他需求Edge Preview用户级别初级范例文件RahkosRamen_Exercise.zip自Adobe Edge的第一个预览版于8月1日发布以来,此应用程序已被下载了超过150,000个副本。从这一事实看来,Edge不再是一个beta版本,它从那时起已经历了3个主要版本。它赢得了如此多的关注,我们完全可以想象,Edge一定会成为Web设计人员工具箱中不可缺少的一部分。出于某种原因,本教程主要介绍预览版3。预览版1专注于用户界面、图形和动作。预览版2是对预览版1的反馈的直接结果,进行了诸多实用性增强和错误修 阅读全文
posted @ 2012-11-07 22:50 Adobe Edge 阅读(1616) 评论(1) 推荐(0)