dreamweaver经典网页特效及网页代码设计技巧系列之---文字跳舞效果

dreamweaver 经典网页特效及网页代码设计技巧系列之---

文字跳舞效果

脚本说明:

第一步:把如下代码加

入区域中

language=JavaScript>

language=JavaScript

>

keyFrm=1;

for (j=0;

j

props =

sprite.values[j]; if (numKeyFr != props.length) { if (props.prop2 == null)

sprite.obj[props.pr

op] =

props[fNew-firstKeyFr];

else

sprite.obj[props.prop2][props.prop] = props[fNew-firstKeyFr];

} else {

while

(keyFrm

fNew>=sprite.keyFrames[keyFrm])

keyFrm++;

if (firstTime || fNew==sprite.keyFrames[keyFrm-1]) { if (props.prop2 == null)

sprite.obj[props.prop] =

props[keyFrm-1];

else

sprite.obj[props.prop2][props.prop] = props[keyFrm-1]; } } } } } } else if

(sprite.charAt(0)=='b' && fNew ==

sprite.frame)

eval(sprite.value); if (fNew >

https://www.doczj.com/doc/cb19041307.html,stFrame) tmLn.ID = 0; } }

}

function

MM_timelineGoto(tmLnName, fNew, numGotos) {

var

i,j,tmLn,props,keyFrm,sprite,numKeyFr,firstKeyFr,lastKeyFr,propNum,t heObj; if (document.MM_Time == null)

MM_initTimelines(); tmLn =

document.MM_Time[tmLnName];

if (numGotos != null)

if (tmLn.gotoCount == null)

tmLn.gotoCount = 1; else if

(tmLn.gotoCount++ >= numGotos)

{tmLn.gotoCount=0; return}

jmpFwd = (fNew > tmLn.curFrame); for (i = 0; i <

tmLn.length; i++) { sprite = (jmpFwd)? tmLn[i] :

tmLn[(tmLn.length-1)-i];

if (sprite.charAt(0) == "s") {

numKeyFr =

sprite.keyFrames.length;

firstKeyFr =

sprite.keyFrames[0]; lastKeyFr =

sprite.keyFrames[numKeyFr - 1];

if ((jmpFwd &&

fNew

lastKeyFr

for (keyFrm=1;

keyFrm

fNew>=sprite.keyFrames[keyFrm];

keyFrm++);

for (j=0;

j

props =

sprite.values[j]; if (numKeyFr == props.length)

propNum = keyFrm-1

else propNum =

Math.min(Math.max(0,fNew-firstKeyFr),props.length-1); if (sprite.obj != null) {

if (props.prop2 == null)

sprite.obj[props.prop] = props[propNum]; else

sprite.obj[props.prop2][props.prop] = props[propNum]; } } } else if

(sprite.charAt(0)=='b' && fNew ==

sprite.frame)

eval(sprite.value); }

tmLn.curFrame = fNew;

if (tmLn.ID == 0) eval('MM_timelinePlay(tmLnName)');

}

function

MM_initTimelines() { //MM_initTimelines() Copyright 1997 Macromedia, Inc. All rights reserved.

var ns =

navigator.appName == "Netscape";

document.MM_Time = new Array(1);

document.MM_Time[0] = new Array(8);

document.MM_Time["Timeline1"] =

document.MM_Time[0]; document.MM_Time[0]

.MM_Name =

"Timeline1";

document.MM_Time[0].fps = 10;

document.MM_Time[0][0] = new

String("sprite"); document.MM_Time[0][0].slot = 1;

if (ns)

document.MM_Time[0]

[0].obj =

document["Layer1"]; else

document.MM_Time[0][0].obj =

document.all ?

document.all["Layer1"] : null;

document.MM_Time[0][0].keyFrames = new Array(2, 6, 9, 12, 15,

18);

document.MM_Time[0][0].values = new Array(4);

document.MM_Time[0][0].values[0] = new

Array(263,264,265,266,268,268,268,268,271,272,273,270,268,266,265,264,26 3); document.MM_Time[0]

[0].values[0].prop = "left";

document.MM_Time[0][0].values[1] = new

Array(101,95,89,82,76,87,98,108,100,93,86,91,96,100,102,104,106);

document.MM_Time[0][0].values[1].prop = "top";

if (!ns) {

document.MM_Time[0][0].values[0].prop2 = "style";

document.MM_Time[0][0].values[1].prop2 = "style";

}

document.MM_Time[0][0].values[2] = new Array(58,54,50,46,4

3,33,24,15,20,25,31,36,41,47,48,49,50);

document.MM_Time[0][0].values[2].prop = "width";

if (!ns)

document.MM_Time[0][0].values[2].prop2 = "style";

document.MM_Time[0][0].values[3] = new

Array(52,51,50,49,48,46,44,42,43,44,45,46,47,49,48,47,47); document.MM_Time[0][0].values[3].prop = "height";

if (!ns)

document.MM_Time[0][0].values[3].prop2 = "style";

document.MM_Time[0]

[1] = new

String("sprite"); document.MM_Time[0][1].slot = 2;

if (ns)

document.MM_Time[0][1].obj =

document["Layer2"]; else

document.MM_Time[0][1].obj =

document.all ?

document.all["Layer2"] : null;

document.MM_Time[0][1].keyFrames = new Array(2, 5, 9, 12, 15, 18);

document.MM_Time[0][1].values = new Array(2);

document.MM_Time[0]

[1].values[0] = new

Array(323,323,322,322,322,322,322,323,324,326,328,326,324,322,322,322,32 3); document.MM_Time[0][1].values[0].prop = "left";

document.MM_Time[0][1].values[1] = new Array(126,120,115,1

11,110,111,111,111,108,105,101,105,109,113,117,122,126); document.MM_Time[0][1].values[1].prop = "top";

if (!ns) {

document.MM_Time[0][1].values[0].prop2 = "style";

document.MM_Time[0]

[1].values[1].prop2 = "style";

}

document.MM_Time[0][2] = new

String("sprite"); document.MM_Time[0][2].slot = 3;

if (ns)

document.MM_Time[0][2].obj =

document["Layer4"]; else

document.MM_Time[0][2].obj =

document.all ?

document.all["Layer4"] : null;

document.MM_Time[0][2].keyFrames = new Array(2, 5, 9, 12, 15, 18);

document.MM_Time[0][2].values = new Array(3);

document.MM_Time[0][2].values[0] = new

Array(363,363,363,363,363,363,363,363,365,366,368,366,364,363,363,363,36 3); document.MM_Time[0][2].values[0].prop =

"left";

document.MM_Time[0][2].values[1] = new

Array(131,123,115,107,113,119,125,131,122,111,101,113,124,131,131,131,13 1); document.MM_Time[0][2].values[1].prop = "top";

if (!ns) {

document.MM_Time[0][2].values[0].prop2 = "style";

document.MM_Time[0][2].values[1].prop2 = "style";

}

document.MM_Time[0][2].values[2] = new

Array(22,22,22,22,22,22,22,22,22,22,22

,22,22,22,22,22,22); document.MM_Time[0][2].values[2].prop = "width";

if (!ns)

document.MM_Time[0][2].values[2].prop2 = "style";

document.MM_Time[0][3] = new

String("sprite");

document.MM_Time[0][3].slot = 4;

if (ns)

document.MM_Time[0][3].obj =

document["Layer5"]; else

document.MM_Time[0][3].obj =

document.all ?

document.all["Layer

5"] : null;

document.MM_Time[0][3].keyFrames = new Array(2, 5, 9, 12, 15, 18);

document.MM_Time[0][3].values = new Array(2);

document.MM_Time[0][3].values[0] = new Array(388,390,391,3

93,392,391,390,388,390,394,398,397,395,393,390,389,388); document.MM_Time[0][3].values[0].prop = "left";

document.MM_Time[0][3].values[1] = new

Array(131,128,124,121,124,126,129,131,119,103,86,105,122, 136,137,134,131); document.MM_Time[0][3].values[1].prop = "top";

if (!ns) {

document.MM_Time[0][3].values[0].prop2 = "style";

document.MM_Time[0][3].values[1].prop2 = "style";

}

document.MM_Time[0][4] = new

String("sprite"); document.MM_Time[0][4].slot = 5;

if (ns)

document.MM_Time[0][4].obj =

document["Layer6"]; else

document.MM_Time[0][4].obj =

document.all ?

document.all["Layer6"] : null;

document.MM_Time[0][4].keyFrames = new Array(2, 5, 9, 12, 15, 18);

document.MM_Time[0][4].values = new

Array(2);

document.MM_Time[0][4].values[0] = new

Array(413,413,413,413,413,413,413,413,415,416,418,416,414,413,413,413,41 3); document.MM_Time[0][4].values[0].prop = "left";

document.MM_Time[0]

[4].values[1] = new

Array(131,124,118,111,116,120,125,131,119,105,91,107,121,131,131,131,131 ); document.MM_Time[0][4].values[1].prop = "top";

if (!ns) {

document.MM_Time[0][4].values[0].prop2

= "style";

document.MM_Time[0][4].values[1].prop2 = "style";

}

document.MM_Time[0][5] = new

String("sprite"); document.MM_Time[0][5].slot = 6;

if (ns)

document.MM_Time[0][5].obj =

document["Layer7"]; else

document.MM_Time[0][5].obj =

document.all ?

document.all["Layer7"] : null;

document.MM_Time[0][5].keyFrames = new

Array(2, 5, 9, 12, 15, 18);

document.MM_Time[0][5].values = new Array(2);

document.MM_Time[0][5].values[0] = new

Array(433,433,433,433,434,436,437,438,435,432,428,427,427,428,430,431,43 3);

document.MM_Time[0][5].values[0].prop = "left";

document.MM_Time[0][5].values[1] = new

Array(131,131,131,131,128,125,120,116,118,120,121,117,112,106,114,122,13 1); document.MM_Time[0][5].values[1].prop =

"top";

if (!ns) {

document.MM_Time[0][5].values[0].prop2 = "style";

document.MM_Time[0][5].values[1].prop2 = "style";

}

document.MM_Time[0][6] = new

String("behavior"); document.MM_Time[0][6].frame = 19;

document.MM_Time[0][6].value =

"MM_timelineGoto('Timeline1','1')"; document.MM_Time[0][7] = new

String("sprite"); document.MM_Time[0]

[7].slot = 7;

if (ns)

document.MM_Time[0][7].obj =

document["Layer3"]; else

document.MM_Time[0][7].obj =

document.all ?

document.all["Layer3"] : null;

document.MM_Time[0][7].keyFrames = new Array(2, 5, 9, 13, 16, 18);

document.MM_Time[0][7].values = new Array(4);

document.MM_Time[0][7].values[0] = new

Array(458,458,458,458,457,457,457,458,

463,468,473,478,468,459,453,454,458);

document.MM_Time[0][7].values[0].prop = "left";

document.MM_Time[0][7].values[1] = new

Array(101,98,94,91,93,96,99,101,95,88,80,71,77,85,91,97,101);

document.MM_Time[0][7].values[1].prop = "top";

if (!ns) {

document.MM_Time[0][7].values[0].prop2 = "style";

document.MM_Time[0][7].values[1].prop2 = "style";

}

document.MM_Time[0][7].values[2] = new

Array(31,31,31,31,31,31,31,31,31,31,31,31,31,31,31,31,31);

document.MM_Time[0][7].values[2].prop = "width";

if (!ns)

document.MM_Time[0][7].values[2].prop2

= "style";

document.MM_Time[0][7].values[3] = new

Array(42,42,42,42,42,42,42,42,42,42,42,42,42,42,42,42,42); document.MM_Time[0][7].values[3].prop = "height";

if (!ns)

document.MM_Time[0]

[7].values[3].prop2 = "style";

document.MM_Time[0].lastFrame = 19; for (i=0;

i

document.MM_Time[i].ID = null;

document.MM_Time[i].curFrame = 0;

document.MM_Time[i].delay =

1000/document.MM_Time[i].fps;

}

}

//-->

第二步:把中的

内容改为:

bgcolor="#fef4d9" onload="MM_timelinePlay('Timeline1')">

基于Dreamweaver动态网页制作技术技巧

基于Dreamweaver动态网页制作技术技巧 在Dreamweaver中有很多有用的技巧，如果运用得当，不仅能提高效率，而且可以实现很多实用的效果。 一、站点及窗口规划的技巧 1、快速添加站点导航。 使用站点窗口中的网站地图可以快速制作网站雏形，并可以方便的在个页面之间加入导航链接。首先打开站点地图窗口，选中index.htm文件，点击并拖动站点导航(Site Navigation)窗口中index.htm文件右上角的小圆圈，将它拖动到左边文件窗口中的某一个文件上，如图1所示。 图1 快速添加站点导航 Dreamweaver会自动将mydesign.htm的链接加入到index.htm文件中，同样执行此操作并分别指向其他相关链接文件后，导航窗口如图2所示。 图2 利用站点导航快速添加网页链接 此时打开index.htm文件，可以看到相应的链接文字和链接都已经添加好了，可以根据需要将他们合理的修改和组织。如图3所示。 图3 快速添加网页链接 2、快速修改文件Title。很多时候新建的文件往往忽视设定文件Title的内容，事后需要修改时，常常得打开每一个文件分别修改。其实这个工作可以在站点窗口中方便的完成。打开站点窗口View菜单下的Show Page Titles，可以使站点窗口中的文件显示出文件头，而不是原先的文件名。默认的文件头是Untitled Document可以分别两次点击，改变默认的文字为需要的文件头。如图4所示。 图4 快速修改文件Title 3、快速生成站点地图。有时需要制作一个包含当前站点所有文件结构的站点地图而找不到合适的方法。Dreamweaver本身就带有这个功能，方法如下：打开File—Save Site Map 命令，在弹出对话框中输入保存的文件名，Dreamweaver会在当前站点的根目录下自动生成一个.bmp或.png格式的站点图片。 二、页面布局阶段的技巧 Dreamweaver不仅是一个良好的页面制作工具，同时他还可以进行精确的页面排版和布局，这一部分介绍几个页面布局方面的技巧。 1、打开辅助表格。制作者都特别希望能精 确的定位网页元素，特别是希望每个元素都能

中文版+Dreamweaver+CS6网页设计教程_IT168文库

第1章Dreamweaver CS6简介 Dreamweaver CS6是一款功能强大的可视化的网页编辑与管理软件。利用它，不仅可以轻松地创建跨平台和跨浏览器的页面，也可以直接创建具有动态效果的网页而不用自己编写源代码。Dreamweaver CS6 最主要的优势在于能够进行多任务工作，并且在操作方法、界面风格方面更加人性化。用户可以根据自己的喜好和工作方式，重新排列面板和面板组，自定义工作区。 本章主要内容 ●Dreamweaver CS6的新增功能。 ●Dreamweaver CS6的安装、删除和启动。 ●Dreamweaver CS6的工作界面。 ●Dreamweaver CS6的一般操作。 本章重点 ●Dreamweaver CS6常用面板的使用方法。 ●Dreamweaver CS6的文件操作。 1.1 Dreamweaver CS6概述 Dreamweaver CS6 是世界顶级软件厂商Adobe推出的一套拥有可视化编辑界面，用于制作并编辑网站和移动应用程序的网页设计软件。在业界通常将Dreamweaver、Flash、Fireworks称为“网页三剑客”。 由于它支持代码、拆分、设计、实时视图等多种方式来创作、编写和修改网页，因此对于初级人员，无须编写任何代码就能快速创建Web页面。其成熟的代码编辑工具更适用于Web开发高级人员的创作。CS6新版本使用了自适应网格版面创建页面，在发布前可使用多屏幕预览审阅设计,大大提高了用户的工作效率，而改善的FTP性能可更高效地传输大型文件。“实时视图”和“多屏幕预览”面板可呈现HTML5 代码，用户能更方便地检查自己的工作。 1.2 Dreamweaver CS6的新增功能 相对于以前的版本，Dreamweaver CS6的功能主要在以下方面进行了增强。 1. 可响应的自适应网格版面 使用响应迅速的CSS 自适应网格版面，可以创建跨平台和跨浏览器的兼容网页设计。利用简洁、业界标准的代码可为各种不同设备和计算机开发项目，提高工作效率。用

Dreamweaver网页动态特效教程

Dreamweaver网页动态特效教程 一、介绍 Dreamweaver是一款强大的网页制作软件，其丰富的特效功能 使得网页设计更加生动和具有吸引力。本教程将介绍Dreamweaver中动态特效的应用，帮助读者快速制作出令人惊艳 的网页动画效果。 二、背景知识 在学习动态特效之前，有些基本知识是必要的。首先，要了解 网页中的HTML、CSS和Javascript三者之间的关系和作用。这三 个标准技术在网页设计中起到至关重要的作用。其次，对于动态 特效的实现需要掌握基本的CSS和Javascript知识，包括选择器、属性和方法等。 三、基本动态特效 1. 图片轮播 图片轮播效果在网页设计中非常常见，可以使网页变得更有吸 引力。在Dreamweaver中，使用Javascript的代码可以实现简单的 轮播功能。可以通过设置延时函数和计时器实现图片的自动切换，或者通过点击事件改变展示图片。 2. 导航动画

网页导航条是用户浏览网站的重要组成部分，为了使导航更吸 引眼球，可以通过动画效果提升用户体验。在Dreamweaver中， 可以通过设置CSS的过渡和动画属性来实现导航栏的动态效果， 比如菜单项的放大、颜色渐变等。 四、高级动态特效 1. 视差滚动效果 视差滚动效果是一种通过不同层级元素的滚动速度差异来创建 的效果，使得页面的深度和立体感更加突出。在Dreamweaver中，可以通过使用CSS和Javascript的组合来实现这一效果。通过控制元素的滚动速度和位置，可以使页面中的元素具有立体感，并且 引导用户的注意力。 2. 瀑布流布局 瀑布流布局是一种网页设计中常用的动态效果，常用于图片墙 等场景。在Dreamweaver中，可以通过CSS和Javascript结合来实现瀑布流布局。通过计算每个元素的位置和高度，动态调整元素 的位置，实现瀑布流效果。 五、实际案例 为了更好地理解动态特效的应用，下面以一个实际案例来说明。假设我们要制作一个产品展示页面，页面包含多张产品图片和文

dreamweaver经典网页特效及网页代码设计技巧系列之---图片渐变效果

dreamweaver 经典网页特效及网页代码设计技巧系列之--- 图片渐变效果 脚本说明: 把如下代码加入 区域中