推荐阅读

(6-9):制作网页翻转按钮
大家经常在一些网页中看到一种会随着鼠标的接触而变色的按钮,参见范例网页。这称之为鼠标翻转效果,这是根据英文rollover翻译而来的,其实不是很符合中文的语境。其原理是利用两张图片,平时显示一幅,当鼠标接触后换成另外一幅图片。如下图。这样看起来好像是鼠标接触的时候按钮变亮了。现在我们来动手制作,首先在Photoshop中将它们制作成图片,然后再做成网页。首先新建一个400×300的白底图像,新建一层,利用形状工具椭圆〖U/SHIFTU〗,在公共栏选择第3种绘图方式(填充像素),调出信息调板〖F8〗观看数值,用任意颜色在新建层中间位置画一个直径40左右的正圆(按住SHIFT保持正圆)。如下左图。0614【窗口>样式】调出样式调板,点击右上角圆三角按钮,选择“替换样式”,在出来的样式列表目录中选择“Web翻转样式”,确认目前选择的是新建层,然后使用“选中状态的蓝色胶体按钮”样式。如下中图红色箭头处。大家也可以自己选择其他颜色的。0615将新建层与背景层合并,然后【图像>修整】,如下右图所示。确定操作后图像将被裁剪为和所画的圆同等大小。这个命令的作用是根据左上角第一个像素处,或右下角最后一个像素处的颜色,在我们这幅图像中这两个地方都是白色。然后就将画面中连续的白色部分裁剪掉。这就好像现实中打印图像之后将纸张的边缘裁剪掉一样。接着将背景图层复制一层,对复制出来的图层使用曲线工具,合并高光和暗调区域(高光点229,255;暗调点60,0),形成加亮按钮的效果。如下左图。完成后我们得到两个图层,分别是暗色按钮的背景层,和亮色按钮的背景复制层。如果以上步骤无法完成,点此下载范例文件0616使用【文件>在ImageReady中编辑】〖CTRLSHIFTM〗,或点击工具栏最下方按钮,将会跳转到ImageReady中,这是Photoshop附带的一个软件,用来制作动画和网页。我们找到Web内容和图层两个调板,如下右图。后面的操作就是由这两个调板配合完成。 在完成以上5个步骤后,我们就可以开始制作鼠标翻转效果了。开始之前我们先简要介绍一下制作的原理。范例网页大家也看过,是随着鼠标的接触而发生的。这里涉及一种概念,叫事件和方法。我们的日常生活就是由许多事件和方法组成的,比如口渴是事件,喝水就是解决这个事件的方法。肚子饿是事件,吃东西就是方法。想学习是事件,看《大师之路》就是方法等等。这其实就是一种编程的思想,和人一样,电脑也是由事件和方法组成的一套逻辑系统。所以下面我们也要按照这种思路,去创建一个事件和解决方法。这个事件就是鼠标接触事件。平时鼠标不接触,我们只显示暗色按钮层(背景层)。而在鼠标接触的事件发生后,显示亮色按钮层(背景副本层)。

AutoCAD 2007 入门教程-CAD图形的输入输出
AutoCAD 2007 提供了图形输入与输出接口。不仅可以将其他应用程序中处理好的数据 传送给 AutoCAD ,以显示其图形,还可以将在 AutoCAD 中绘制好的图形打印出来,或者 把它们的信息传送给其他应用程序。此外,为适应互联网络的快速发展,使用户能够快速有效地共享设计信息, AutoCAD 2007 强化了其 Internet 功能,使其与互联网相关的操作更加方便、高效,可以 创建 Web 格式的文件 (DWF) ,以及发布 AutoCAD 图形文件到 Web 页。 AutoCAD 2007 除了可以打开和保存 DWG 格式的图形文件外,还可以导入或导出其他格式的图形。 导入图形 在 AutoCAD 2007 的 “ 插入点 ” 工具栏中,单击 “ 输入 ” 按钮将打开 “ 输入文件 ” 对话框。在其中的 “ 文件类型 ” 下拉列表框中可以看到,系统允许输入 “ 图元文件 ” 、 ACIS 及 3D Studio 图形格式的 文件。 在 AutoCAD 2007 的菜单命令中没有 “ 输入 ” 命令,但是可以使用 “ 插入 ” | 3D Studio 命令、 “ 插入 ” | “ ACIS 文件 ” 命令及 “ 插入 ” | “ Windows 图元文件 ” 命令,分别输入上述 3 种格式的图形文件。 插入 OLE 对象 选择 “ 插入 ” | “ OLE 对象 ” 命令,打开 “ 插入对象 ” 对话框,可以插入对象链接或者嵌入对象。 输出图形 选择 “ 文件 ” | “ 输出 ” 命令,打开 “ 输出数据 ” 对话框。可以在 “ 保存于 ” 下拉列表框中设置文件输出的路径,在 “ 文件 ” 文本框中输入文件名称,在 “ 文件类型 ” 下拉列表框中选择文件的输出类 型,如图元文件、 ACIS 、平板印刷、封装 PS 、 DXX 提取、位图、 3D Studio 及块等。

自己动手制作活动菜单条
用QQ聊过天的朋友都对它的自动隐藏窗口功能爱不释手,它可以使窗口显得清爽整洁而且富有动感,笔者的几个朋友都想在自己的网页中加入类似的东东,经过共同摸索发现用Dreamweaer 就可以实现这种效果,下面我们通过一个活动菜单条的制作来看看吧。 第1步:制作菜单外貌 在Dreamweaer 中新建一个文件,绘制一个层,在该层中插入一个表格(如图1),对该表格进行修饰,然后加入菜单项并建立各项的超链接,为了去掉超链接的下划线,可以编辑超链接的Css样式,在CSS样式面板中通过CSS选择器将“Link”和“Hover”的“Decoration(装饰)”均设置为“None(无)”,将“Hover”的“Color(颜色)”设置为红色,最后将设置好的样式应用到各个菜单条中(可按“F12”键预览效果)。 第2步:设计菜单的动态效果 1、选定层面,当鼠标变成“十”字形时按住左键将层面拖动到页面右上角(使整个菜单条完全露出但上边缘正好靠拢页面上边界),在窗口菜单中打开时间线面板,选定层面将其拖动到时间线上,Dreamweaer会自动产生一个长度为15帧的动画对象,拖动该动画对象的最后一个关键帧到第30帧,将其长度设置为30帧。然后在第15帧处单击右键,在弹出的快捷菜单中选择“添加关键帧”选项插入一个关键帧,并将层面拖动到适当位置(如图2)。

数码摄影10个技巧
以前一定听过这种话:数码相机(以下用DC)无所不能。你只要按下按钮,一张伟大的照片就会变魔术般展现在你面前。相机越好,照出来的照片越好。果真如此吗?见鬼,当然不是了! 事实是你可以用一个简单的消费级傻瓜DC拍出一张伟大的照片,也可以用最贵的DC拍出一张垃圾照片。漂亮的照片不是相机搞出来的,而是摄影师搞出来的。只要有一些拍摄方面的知识,再加上不断改进的愿望,你可以用你的小DC拍出能登上时代周刊的大照片。 为了帮助你在成为伟大摄影师的道路上快步前行,这里送给你10个技巧,它们会让你即使不花大价钱买昂贵的设备也能像专业人士一样拍照。 1.暖化你的照片 你注意过有些时候你拍的照片有一种冷冷的感觉吗?如果答案是肯定的,那你并不是孤独呵呵。DC的默认白平衡设置是“自动(auto)”,虽然在大部分情况下都是适用的,但有时候却会让景物太“冷”了。 当你拍户外景物的时候,特别是当阳光充足时,试着把你的白平衡调到“多云(cloudy)”那一档。对,就是“多云”那一档,这个变化跟在你的镜头前加一个暖色滤镜的效果是一样的。它使得照片中红色和黄色的更加丰满,从而暖化了这张照片 图1a是在一个山区拍摄的,白平衡设置在“自动(auto)” 图1b 同一个场景,我把白平衡换成了“多云(cloudy)”,同时把一副Costa Del Mar太阳镜放在了镜头前(佳能PowerShot S200,程序模式program mode) 如果你不相信我,那就试试吧。在户外分别用自动白平衡和多云白平衡拍两组照片,然后在你的电脑上对比着看,我猜你一定会喜欢看上去暖洋洋的那一组的 2.用太阳镜做偏振镜
最新发布

Flash MX实战精选:放大镜效果
实例说明 透过跟随鼠标移动的放大镜,可看到美味的食品,不知味口如何! 有关知识 遮照,拖拽电影片断,设定目标属性及变量。 制作过程 步骤1:打开flash,建立一个新文件。新建bg层,放置在场景最底层,从菜单栏选择文件>导入(File>Import)。导入一个图像,将它遮盖住整个场景。另外,在库中它这个位图将命名为t1。 步骤2:从菜单栏中选择插入>新建符号(Insert>New Symbol),在出现的对话框中选图像(Graphic),命名为pic。把库中的位图t1拖入pic里,将t1的左上角和中心点对齐,并把t1适当放大。如图1所示。

Flash MX实战精选:制作网站标志
实例说明 这是个动画曾经作为宇风多媒体站标,用Flash来做网站标志,有GIF动画所无法达到的效果,如果用它作为交换用的logo,必定能得到更多目光及点击。 有关知识 旋转的地球、呈放射状运动的星空、动感标题、复合动画的生成等。 制作过程 一、旋转的地球 步骤1:选菜单栏中的插入>添加符号(Insert>New Symbol),在出现的对话框中选图像(Graphic), 命名为“圆形”,用点选椭圆,在Color Mixer面板,将线条颜色选为空 ,在舞台画一个填充了颜色的圆,如图1所示。

Flash MX实战精选:汽车广告
实例说明 这是一个产品广告动画,主要用作在互联网上进行产品、服务或者企业形象的宣传。由于广告动画中采用了很多电视媒*作的表达手法,且又具备网络传输的短小精干的独特优势,这正是Flash广告动画之所以风靡全球的原因。 有关知识 这是一个多重复合动画,我们将分别就“汽车启动”,“靓车展示”及“假LOADING效果”进行剖析介绍。 制作过程 一、汽车启动 步骤1:选择菜单中的插入>添加组件(Insert>New Symbol),在出现的对话框中选图像(Graphic),命名为che。选择文件>导入(File>Import),将一张车头图片加入舞台,在菜单上选择修改>打散(Modify>Break Apart),然后用鼠标点击车头以外的部分,再在工具栏活动面板上选择套索工具,在下方的附属工具中选择魔术棒,点击车头的黑色背景,即选取背景,然后按键盘上的Delete删除黑色部分。如图1所示。

Flash MX实战精选:大变活人
实例说明 通过隐形按钮和电影片断的灵活应用,制作一个“大变活人”的flash特效。 有关知识 绘制图像、隐形按钮、电影片断(Movie Clip)的灵活应用。 制作过程 步骤1:打开Flash,建立一个新文件。按Ctrl+M键,将帧速度(Frame rate)设为30帧/秒,Dimensions设为450px*300px,背景颜色为#FFFFFF。 步骤2:使用flash的绘图工具绘制多个人物头像(一般5-7个即可),也可先用其他矢量图工具绘制,然后导入Flash中,如图1所示。

在Flash MX中插入录像
Flash MX的一个新功能就是可以在Flash中直接导入一段视频录像作为Flash动画,但笔者在使用时发现导入的录像只有视频没有音频,也不能随意对导入录像进行编辑,而且在低版本的Flash中也没有此功能。如果你的电脑中装有《超级解霸2001》或《超级解霸3000》,可以利用它所带的音频、视频处理工具在Flash 5.0中轻松搞定插入录像片段。 要在Flash 5.0中插入录像片段,首先要有视频和音频来源,这些素材都可以由《超级解霸》来解决。由于在Flash 5.0中只支持图片的导入,所以这里的视频实际上是指一系列连续变化的图片。用《超级解霸》打开一段录像并播放,选择需要片段的开始点和结束点,点击“停止播放”,然后点击“连续摄像”按钮(如图),在保存图像对话框中设置好文件名和保存路径,点击“保存”。保存完成后你就会在保存文件夹中看到很多图片文件,文件名是以上面设置的文件名为开头后面加上001到00X组成的,如1001.bmp到1024.bmp等,这些图片就是刚才“连续摄像”保存下来的。用相同的方法,在《音频解霸》中截取一段声音作为音频素材,在存声音文件时,你可以选择MP3压缩格式或波形文件(WAV格式)。

Flash MX实战精选:定义弹出窗口
实例说明 在设计网页的过程中,经常要制作一些弹出窗口,并且窗口的大小、隐藏菜单栏、工具栏等属性都可改变。 有关知识 通过javascript来控制弹出窗口的属性。 制作过程 步骤1: 打开Flash,建立一个新文件。从菜单栏中选择插入>添加符号(Insert>New Symbol),在出现的对话框中选按钮(Button),命名为button,用矩形工具在Up帧画一矩形方框,如图1所示。

Flash MX实战精选:音乐播放器
音乐播放器 实例说明 作在同一电影中控制多个背景音效的播放器。 有关知识 导入点阵图, tell atrget和stop all sounds命令的应用,控制音效的循环播放。 制作过程 步骤1:打开Flash,新建电影文件,设置尺寸:235px*100px,背景颜色为黑色(#000000)。 截取WinAMP的面板图,用图像工具处理后导入Flash中,并将其转换为图像符号bg,在场景中新建bg层,帧长度为4,将图像符号bg放置在bg层中作为背景,使用缩放工具,将图像bg大小调整到和舞台大小相同。如图1。stop ();stopAllSounds ();tellTarget ("/sound1") { gotoAndPlay (5);}tellTarget ("/music") { gotoAndPlay ("track1");}tellTarget ("/amp") {

真正的离线Web要靠HTML 5
在 Internet 连接无处不在的今天,我们忽然有了另外一个需求,离线 Web。Gmail, Google Reader, Zoho 这些优秀的 Web 应用都支持离线使用,这归功于 Google Gears。然而真正的离线 Web 要靠 HTML 5,这个未来的 Web 语言明星将为 Web 的离线存储制定一套标准,W3C已经发布 HTML5 离线存储细则。有人可能会说,离线 Web 毫无意义,你得到的只是一个蹩脚的桌面程序,在 wi-fi, 3G 无处不在的今天,我们大部分时间都是在线的,这虽然没错,但我们当中那些已经对各种 Web 应用,如 email, 在线新闻以及 Twitter 一刻不可或缺的人来说,离线 Web 是非常重要的。不过问题总是有的,HTML5 Web 存储细则中牵扯到很复杂的问题,SQLite。那些需要编写离线 Web 程序的人需要编写 SQL 代码,SQLite没有错,但它是 SQL 的一个变种,和标准 SQL 有些差别,另外,SQLite 并不属于 W3C,它的所有者很有可能某一天改变它的接口,这会导致那些已经写就的 Web 程序必须重新编写。是否有更好的方法?Mozilla 实验室的 Atul Varma 最近发布了一篇博客文章,提供了一种替代方案。Varma 正在研究 CouchDB 的一个实验版本,在浏览器中,将该数据库的语义用 JavaScript 实现。最终,我们或许可以直接使用 JavaScript 实现数据库查询,消除 HTML5 在这方面的问题。针对这篇文章,Mozilla Fennec 移动浏览器团队的 Mark Finkle 在评论中表示,这个方案回避了标准数据库后台中更主要的问题,最好让 localStorage/globalStorage 成为标准,让标准保留在底层,他在自己的一篇博客文章中指出,应当建立一个 JavaScript 库,就像现有的很多 JavaScript 库可以操作网页元素一样,也应当有个 JavaScript 库用来操作离线 Web 存储数据。这种方法表面上看很复杂,但会为开发者带来灵活,当 Web 无所不能的时候,我们的机会会更多。本文国际来源:http://www.webmonkey.com/blog/Why_JavaScript_Will_Save中文翻译来源:COMSHARP CMS 官方网站

Photoshop网页设计按钮源文件
按钮(button)是网页中实现人机交互的关键功能之一,如果缺少了按钮,那么互动将无从谈起。设计一个漂亮,吸引人的按钮并不容易,特别是对于Photoshop新手来说。今天奋斗网络为大家搜集了这12个Photoshop的按钮源文件,利用这些源文件,再加上自己需要的文字,就可以轻松设计制作属于你自己的按钮。同时我们也可以从这些PSD文件中学习到制作按钮的技巧,提升自己的Photoshop技术。下载链接下载链接下载链接下载链接下载链接下载链接 下载链接

HTML:命名空间与字符编码
在做项目的过程中,我们经常会建立各种各样的规范,以方便团队之间更好的合作更好的完成项目;同样我们也经常会听到各种各样的协议,比如Google的IM软件Gtalk使用的开放的XMPP协议,只要其他IM软件也遵循XMPP协议就能与Gtalk使用互通;而互联网上的信息无以计数,这些信息本身是独立存在的,如何将其串联并呈现在用户眼前,就需要使用到HTTP协议。同样的道理,因为浏览器们各自的内核不同,对于默认样式的渲染也不尽相同,所以就需要一份各浏览器都遵循的规则来保证同一个网页文档在不同浏览器上呈现出来的样式是一致的,这个规则就是DOCTYPE声明。因为互联网是互通的,所以任意的两个或者以上的网页文档都可能会涉及到数据交换,而因为XML语言是允许用户自定义标签的,所以任意两个交换的文档就可能会出现相同的标签,从而导致相同标签的冲突,所以就需要一个命名空间以区分开交换文档中可能存在的相同标签。XHTML做为HTML向XML过渡的一种语言,并不能实现XML语言中的用户自定义标签,所以XHMTL文档中的命名空间都是相同的:<html xmlns=”http://www.w3.org/1999/xhtml”>xmlns即是XHTML namespace的缩写,也就是所谓的“命名空间”。与DOCTYPE声明一样,xmlns也属于一种声明。与HTML文档中仍然存在DOCTYPE声明不一样的是,在HTML文档是不存在xmlns的,我们平常所见到的xmlns都是出现在XHTML文档中的。在制作一个网页的时候,除了在开始的时候声明DOCTYPE(文档类型)之外,如果是XHTML文档还需要声明命名空间,而第三个需要声明的就是网页文档的字符编码类型:<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />为了能被浏览器正确的解释以及通过W3C验证,每个XHTML文档都应该声明所使用的字符编码。很多时候网页文档出现乱码大部分都是由于字符编码不对而引起的。