Dreamweaver怎样实现飘浮光球特效

大家都知道,Dreamweaver是一款专业的网页设计工具,提供了许多方便、实用的功能,使得以前许多网页效果的实现从繁琐的代码中解脱出来,只要轻点鼠标即可实现。其中为网页图像增添特效就是其具有特色的功能之一,利用它可以为图像添加诸如阴影、运动、波浪、及淡入淡出等特效。这种特效不会增加图像的大小,当然也不会影响其下载速度。其具体的实现方法如下:

1、在Dreamweaver编辑窗口中,点击菜单命令“Window/Css Styles”打开样式浮动面板,在浮动面板中点击右键菜单中的“New Style”选项或者点击右下角带“+”的按钮,打开新增样式对话框(如图1),在“Name”栏中输入新增特效名称,并选择Type的第一个选项:“Make custom style”,然后点击“OK”按钮,并在出现的保存对话框中输入文件名保存样式文件。

[ 图1 填上特效名称 ]

2、在随即出现的样式定义设置对话框中,选择Category列表框中的最后一项“Extensions”选项(如图2),打开扩展窗口参数设置窗口,其中“Page Break”选项用于设置样式应用前后的位置,可以不予设置,而“Visual Effect”下的“Cursor”则用于自定义鼠标指针形状,“Filter”用于选择效果的类型,共有16个选项。用户选择好效果类型以后,将其中有问号的地方改成自己希望的参数,点击“OK”即完成样式的定义。

[ 图2 选择设置参数 ]

3、点击菜单“Insert/Image”打开图片,选择对话框插入希望应用特效的图像,然后在编辑窗口中选中该图像,并点击样式浮动面板中刚才创建的样式,按下“F12”键,在浏览器中即可看到特效显示的最终效果。如图3即为Filter类型为“Wave”,参数为:“Add=1,Freq=6,LightStrength=20,Phase=8,Strength=15”的样式在图片上应用以后的效果对比。

[ 图3 最终效果 ]

4、如果用户应用后对效果不很满意的话,可以在样式浮动面板中点击快捷菜单中“Edit”选项,重新打开样式定义窗口进行参数设置,直到满意为止。

【拓展阅读】

Dreamweaver时线的应用

时线面板负责改变层或图片在整个时间上的属性。如果要打开这个面板可以选Window菜单中的timelines命令。下面我们看这个面板的`具体内容。请看图B一。面板上最上一栏是控制项。下面标有大写B(Behavior)的栏是行为栏,中间是时间标尺,标尺上有一个红色的小块是监视块,这个小方块表明了当前的显示状况。最下面是各个项目,图中有两个项目,一个是层项目,一个是图片项目。下面我来介绍时线面板的具体用法。

选择栏中包含对时线名称的选择和修改,当我们建立多个时线时可以用这个选择项快速地在各时线间穿插,在网页比较复杂时建立多个时线可以更好的编辑或组织。图中显示的时线是“timeline1”。接下来的几个按钮是监视位置的选择,最左边一个是将监视块调到最左边。

倒退按钮是将监视块向左移动一小格,播放按钮是将监视块向右移动一小格,如果当前位置上没有任何项目则使用播放按钮监视块不会向前滑动,而使用倒退按钮则立即回到项目的尾端(最右端)。这几个按钮中间是监视块所在的具体位置。可以通过这个框确定监视块的详细位置。“Fps”框允许作者指定动画每秒的帧数,缺省值为15,这是一个平均数,每秒15帧在大多数情况下可以达到较好的显示效果。

如果浏览者的机器更好的话我们还可以增加每秒的帧数,这样显示效果更加平滑。这一栏右面的“Autoplay”检查框是设置动画的播放方式。选中时会弹出对话框告诉用户这一项已选中,当网页被开启的时候会自动播放动画。如果我们选中“Loop”检查框,也会弹出对话框告诉用户这一项已选中,动画会循环播放。一般情况下这些项都可以选中,除非我们为了使网页更灵活而设定在浏览者执行某种动作时播放动画。比如当传输速度十分有限时,我们可以先使用一幅静止的图片,当浏览者点击这幅图片时播放动画。这样既分散了等待的时间,使浏览者不至于因为长时间看不到网页而放弃浏览,又兼顾了网页的质量。我们可以随时点击带有问号的按钮来获得帮助,就像其它浮动面板上的问号按钮一样。

时线面板中的行为栏功能不凡。我们可以在任意位置上增加相应的行为以增强对页面的控制和对外界的适应。图一中的时间栏中有两个方块,一个黑色,另一个是中间有黑色减号标志的淡紫色方块。黑色的一个在我们点中行为栏上某个区域后出现表明已选中这个区域,可以在这个时间上设置行为,选中的同时监视块也滑到选中的时间上,这样作者可以看到执行行为时页面的状态。

【Dreamweaver怎样实现飘浮光球特效】相关文章:

dw html 浮动窗口,Dreamweaver怎样实现飘浮光球特效相关推荐

  1. h5 右下角浮动按钮_【js】右下角浮动窗口

    右下角浮动窗口 #msg_win{position:absolute;right:0px;overflow:hidden;z-index:99;border:1px solid #c00;backgr ...

  2. 浮动窗口代码(带关闭按钮+全屏漂浮)

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  3. 类似flashget的浮动窗口的实现

    作者:苍竹先生下载源代码一.简介:象flashget.迅雷.BT等都有浮动窗口,能详细地显示下载的详细信息,该类型的窗口有一下几个特点:1.窗口无标题栏,窗口的大小跟位图一样大.2.前端显示.3.在客 ...

  4. html全局浮窗,Html 实现浮动窗口

    今天在写一个html代码时,需要用到浮动窗口,通知信息,网站找了一下,代码如下 带关闭按钮的浮动窗口代码(全屏漂浮) #fdck {border:1px solid #c0c0c0;margin:0 ...

  5. 【Qt教程】1.9 - Qt5菜单栏、工具栏、状态栏、核心窗口、浮动窗口、QMainWindow

    1. 窗口应用布局样式及组成 PC端软件,最基本的一个窗口应用布局样式,如下: 大体可分为菜单栏.工具栏.状态栏.核心窗口.浮动窗口,使用时按需相互组合. 2. Qt中调用这些控件 1)新建一个工程: ...

  6. 7、菜单栏、工具栏、状态栏、浮动窗口、TextEdit

    新建项目,基类选择QMainWindow,不勾选ui    mainwindow.cpp代码: #include "mainwindow.h" #include <QMenu ...

  7. qt android 浮动窗口,QT+ 状态栏+核心控件+浮动窗口

    #include "mainwindow.h" #include #include #include #include //浮动窗口所需的头文件 MainWindow::MainW ...

  8. Qt开源库-顶级浮动窗口系统-Advanced-Docking-System【01】

    一.序言 顶级浮动窗口是大型软件中的常备组件,例如Visual Studio Code软件界面: 在上图中,将软件界面划分为不同的功能区,每个功能区负责显示软件的一部分功能.在上图中有项目工程管理窗口 ...

  9. 如臂使指——Dojo框架下让浮动窗口跟随鼠标而动

    介绍 在web应用的很多场合,需要让浮动窗口跟随鼠标而动.比如这儿举的一个例子:当用户选中网页上一段内容时,弹出工具条让用户进行标记.可以想象一下,有一个在线看书的应用,支持读者在阅读的时候随时做笔记 ...

最新文章

  1. iphone 使用popViewController如何避免内存泄露
  2. python报错'str' object is not callable
  3. linux --- 基础指令
  4. Ajax中的url使用规则
  5. C语言 回调函数 callback - C语言零基础入门教程
  6. 数据结构与算法-算法入门-什么是算法-算法的挑战
  7. 5G 时代,优酷推出的帧享究竟是什么?
  8. Swift中的Array数组遍历
  9. JavaScript高级程序设计(第3版)
  10. 如何在线查看某个地方的高程值
  11. 导航一体机端口测试软件,车载GPS检测端口和屏幕分辨率的软件:PADTOOL
  12. 关于零信任的 “灵魂” 12问,企业未来如何适配“零信任”?
  13. 北京地铁各条线路介绍
  14. ADO编程详解(C++)
  15. 免费H5页面制作工具大汇总
  16. 前端 day02 CSS
  17. 01基础-算法第四版红黑树-红黑树-数据结构和算法(Java)
  18. 来了超火爆的Java游戏羊了个羊_java开发游戏项目
  19. 荷包app软件测试,智能分贝测试仪app
  20. python控制windows窗口、并输入数据_python win32api win32gui win32con 窗口句柄 发送消息 常用方法 键盘输入...

热门文章

  1. facebook注册工具_如何打开Facebook的数据保护工具
  2. 驱动编程简单教程——PTC512(ADC芯片驱动)为例
  3. Unity(设置鼠标指针贴图)
  4. nba球员数据分析和可视化_可视化NBA球员统计
  5. [转帖]《魔兽世界》的成功之道
  6. TDengine:无模式写入行协议的四种方式
  7. Web应用防火墙(WAF:Web Application Firewall)简介
  8. python程序中每条语句以分号结尾,在Python程序中,每条语句末尾必须添加分号。...
  9. 深度学习平台的搭建(anaconda-pytorch-pycharm)
  10. 深度学习平台配置 Pytorch+RTX3090+Pycharm