用Frontpage创建悬停按钮效果

我们经常在网上遇到这样一种情况:当鼠标移到一个按钮上时,按钮的颜色立即发生变化而且还会发光,或者突然变成了另外一幅图片,十分有趣,动感非常之强。这个效果就是——悬停按钮。

要创建“悬停按钮”可以通过Frontpage 2000来轻松实现。

在没有任何脚本的情况下利用创建悬停按钮来添加动画到您的网页是一种容易的方式。如同其他的按钮一样,悬停按钮也可以含有指向其他网页或文件的超链接。然而,当站点访问者单击或指向悬停按钮时,该按钮与普通按钮的区别便尽显无遗:它不仅能够发光,还可显示自定义图片甚至播放声音效果!

下面我们来看看具体怎么创建悬停按钮。

首先在网页视图模式内,将插入点放置在要创建悬停按钮的位置。

在“插入”菜单上,指向 “组件” ,然后单击 [悬停]按钮,出现“悬停按钮”属性对话框(图1)。

在 “按钮文本” 框内,键入要放在悬停按钮上的文本标签。如果您要输入的标签比较长,请调整“悬停按钮”的 “宽度” 到足以容纳标签的长度。



图1

单击右边的“字体”还可以随意设置文本的字体、字型、大小和颜色。(但您若想使用已包含文本标签的自定义图片,就不必输入任何文本。)

在 “链接到” 框中,键入在站点访问者单击[悬停]按钮时,就会出现的网页或文件的 URL。或者单击 “浏览” 以查找网页或文件的位置。

要设置按钮在网页上开始显示的颜色,请在 “按钮颜色” 框中选择要使用的颜色。注意,如果您单击 “自定义” 并且选择一张要使用在“悬停按钮”上的图片,则无法修改按钮的颜色。

要设置按钮的背景颜色,请在 “背景颜色” 框中为“悬停按钮”选择一种背景颜色。虽然按钮的背景颜色并不能变成透明的,但您可选择与网页背景颜色相配的颜色。

要设置悬停效果的颜色,请在 “效果颜色” 框中为悬停效果选择颜色。

要设置“悬停按钮”的大小,请在 “宽度” 和 “高度” 框内,修改设置(以像素为单位)。如果您在悬停按钮上使用自定义图片,或者按钮文本太长,则必须设置按钮的宽度和高度以匹配图片或按钮文本的宽和高。

至于您最感兴趣的“效果”设置则有发光、反色发光、微微发光、填充颜色、颜色对比、凹进、凸进等7种之多,您不妨耐心地一个一个去试,找出最炫的一种特效。

实际上更为常用的是,您可以事先准备好两幅大小相同的图片,然后选择对话框左下脚的“自定义”选项,在这里您可以为“悬停按钮”设置声音效果或为“悬停按钮”设置具有动态显示效果的图片。比如在“按钮” 框内,键入要用作“悬停按钮”背景的图片的 URL或单击 “浏览” 来查找图片,然后单击 “确定”;再在“悬停时”框内键入要用作“悬停按钮”变化时的图片的 URL,选定后单击 [确定]即可。

在“播放声音”区域,选择操作和声音效果:

为了使站点访问者在单击“悬停按钮”时能够播放声音效果,请在“单击时”框中键入声音效果的 URL或单击 “浏览”来查找声音效果。

为了使站点访问者在指向“悬停按钮”时能够播放声音效果,请在“悬停时”框中键入声音效果的 URL,或单击 “浏览” 来查找声音效果文件所在位置。

注意,因为“悬停按钮”实际上是 Java 小程序,所以您可使用的声音效果文件只能是 .au 格式;而且您不能使用 .midi 或 .wav 格式的声音文件;此外,.au 文件还必须是 8 位,8000Hz,单声道,u 法则格式。全部设置完成后,若要预览“悬停按钮”在访问者利用浏览器浏览您的网页时所呈现的样子,您可以单击“预览”选项卡,或单击“在浏览器中预览”(在 “文件” 菜单上)。

怎么样,鼠标所到之处,图片翻飞音效滚滚,绝对令访问者折服!

(0)

相关推荐

  • unity3d中如何创建UI按钮功能

    unity3d中通过对一个按钮的创建使用,从而了解unity3d中UI的使用. 1.打开unity3d项目"GameObject"--"UI"--"B ...

  • unity3d中怎么创建UI按钮功能?

    unity3d中通过对一个按钮的创建使用,从而了解unity3d中UI的使用. 1.打开unity3d项目“GameObject”--“UI”--“Button”,创建一个按钮. 2.在“Rect T ...

  • 在PowerPoint2013中创建自定义动画效果(通过合并两个或更多动画)

    您可能希望将 PowerPoint 幻灯片上的对象制成动画以执行某些特殊操作–例如,提高徽标在幻灯片上移动时的可见性。即使 PowerPoint 中的动画大库没有您所需的效果,但您可创建自己的效果! ...

  • 在PowerPoint2013中创建自定义动画效果

    您可能希望将 PowerPoint 幻灯片上的对象制成动画以执行某些特殊操作–例如,提高徽标在幻灯片上移动时的可见性。即使 PowerPoint 中的动画大库没有您所需的效果,但您可创建自己的效果! ...

  • PPT2013中如何通过合并两个或更多动画效果来创建自定义动画效果?

    在PPT中允许我们将幻灯片上的对象制成动画以执行某些特殊操作,即便PPT中的动画大库没有我们所需的效果,但依然可以创建属于自己的效果,主要是通过合并两个或更多动画效果或绘制动作路径来创建自己的效果.当 ...

  • Pr 2018 怎样快速在项目面板创建黑场视频效果?

    在我们的日常生活当中,我们经常会遇到一些小问题,这个问题看起来并不重要,但是我们没有掌握其中技巧的话,总会花费我们过多的时间,下面就详细的告诉小伙伴们,Pr 2018 怎样快速在项目面板创建黑场视频效 ...

  • 如何在Adobe Illustrator中创建等轴文本效果

    小编:对于Adobe Illustrator初学者,这个教程将教会大家学习创建文本,以及如何转换为3D对象.还有学习快速选择一些相同属性的形状的操作,并将它们变成复合路径.最后,将学习创建简单的背景, ...

  • 如何在AI中创建积木文字效果?

    小编:对于初学者,你将学习如何设置一个简单的网格以及如何保存一组符号,使用3D Extrude&Bevel效果创建多维数据集形状.将学习如何添加微妙的阴影和简单的背景.本教程与原教程稍有不同, ...

  • 如何创建复古文字效果【AI教程】

    小编:今天@4FIRE带来的文章对初学者非常有益,你将学习如何创建纹理背景,如何使用径向渐变,使用简单的文本并充分利用"外观"面板,利用多个填充和描边,以及如何使用效果或混合技术对 ...