网页设计 课件-使用spry.ppt

《网页设计 课件-使用spry.ppt》由会员上传分享，免费在线阅读，更多相关内容在应用文档-天天文库。

1、使用APDIV的Spry效果项目六布局对象的使用Spry构件（1）Spry菜单栏（2）Spry选项卡式面板（3）Spry折叠式（4）Spry折叠面板1．插入Spry菜单栏①“插入”栏

2、“Spry”类型

3、“Spry菜单栏”按钮或菜单栏“插入”

4、“布局对象”

5、“Spry菜单栏”或“插入”

6、“Spry”

7、“Spry菜单栏”命令。②在弹出的“Spry菜单栏”对话框中选择“水平”或“垂直”，然后单击“确定”按钮。Spry菜单栏2．编辑Spry菜单栏属性“菜单项”：单击列表框中的具体菜单项，在“文本”文本框中编辑输入文本即重新定义该列表项的内容。“添加菜单项”

8、按钮：表示为该菜单项添加了“子菜单”。“删除菜单项”按钮：将该菜单项与“子菜单”同时删除。“上移项”或“下移项”按钮：进行菜单项的显示排序。“链接”：输入链接的目标页面地址，或者单击“浏览”按钮以浏览到相应的文件。“目标”：指定要在何处打开所链接的页面。Spry菜单栏3．设置Spry菜单栏样式设置方法：先选中要设置的菜单（单击选中）。然后在“属性”面板中选择“样式”就可以进行设置Spry菜单栏4．保存含有“Spry菜单栏”的页面在保存含有“Spry菜单栏”的页面文件时，会弹出“复制相关文件”对话框。表示软件将自动复制Spry菜单栏所需要到的CSS文

9、件、JavaScript文件和相关图像文件到站点目录的SpryAssets文件夹内。单击“确定”按钮进行复制，否则将不能保证“Spry菜单栏”的正确运行。Spry菜单栏1．插入选项卡式面板①“插入”栏

10、“Spry”类型

11、“Spry选项卡面板”按钮或菜单栏“插入”

12、“布局对象”

13、“Spry选项卡面板”或“插入”

14、“Spry”

15、“Spry选项卡面板”命令。②对于插入到网页中的“Spry选项卡式面板”，单击左上角的蓝色区域即表示选择了该“Spry选项卡式面板”，进行编辑操作。。Spry选项卡式面板2．添加与删除选择卡面板①在“文档”窗口中单击选项卡左上角

16、的蓝色区域选择该“Spry选项卡式面板”。②在“属性”面板中，单击“添加面板”按钮或“删除面板”按钮。Spry选项卡式面板3．设置默认的打开面板①在“文档”窗口中单击选项卡左上角的蓝色区域选择该“Spry选项卡式面板”。②在“属性”面板中，从“默认面板”下拉列表中选择默认情况下要打开的面板。Spry选项卡式面板4．编辑面板①将鼠标定位在选项卡标题所在区域即可对该标题进行编辑操作。②对于插入到页面中各“Spry选项卡式面板”所对应的内容，鼠标移动到相应的“Spry选项卡”标题时，会显示“单击以显示面板内容”按钮，单击该按钮即可显示面板内容。Spry选

17、项卡式面板5．调整选项卡面板的顺序在“属性”面板中，通过“在列表中向上移动面板”按钮和“在列表中向下移动面板”按钮对页面中的“Spry选择卡”进行左右排序。Spry选项卡式面板Spry折叠式1.插入“Spry折叠式”①选择菜单栏的“插入”

18、“Spry”

19、“Spry折叠式”，或“插入”

20、“布局对象”

21、“Spry折叠式”命令，或在“插入”面板的“Spry”类别中单击“Spry折叠式”按钮。②对于插入到网页中的“Spry折叠式”，单击左上角的蓝色区域即表示选择了该“Spry折叠式”，进行编辑操作。2．添加与删除选择卡面板①在“文档”窗口中选择一个折叠构件

22、。②在“属性”面板中单击“面板”旁边的加号(+)按钮或减号（-）按钮。③（可选）更改面板的名称，方法是在“设计”视图中选择面板的文本并对其进行修改。Spry折叠式3．更改面板的顺序在“属性”面板中，通过“在列表中向上移动面板”按钮和“在列表中向下移动面板”按钮对页面中的面板进行上下排序。Spry折叠式4．打开面板进行编辑请执行下列操作之一：将鼠标指针移到要在“设计”视图中打开的面板的选项卡上，然后单击出现在该选项卡右侧的眼睛图标。在“文档”窗口中选择一个折叠构件，然后在“属性”面板的“面板”菜单中选择要进行编辑的面板。Spry折叠式Spry可折叠面

23、板1．打开或关闭可折叠面板打开或关闭可折叠面板的方法：将鼠标指针移到要在“设计”视图中打开的面板的选项卡上，然后单击出现在该选项卡右侧的眼睛图标。在“文档”窗口中选择一个折叠构件，然后在“属性”面板中，从“显示”下拉列表中选择“打开”或“已关闭”。2．设置可折叠面板的默认状态①在“文档”窗口中选择一个可折叠面板构件。②在“属性”面板中，从“默认状态”弹出菜单中选择“打开”或“已关闭”。Spry可折叠面板3．启用或禁用可折叠面板的动画①在“文档”窗口中选择一个可折叠面板构件。②在“属性”面板中，勾选或撤选“启用动画”复选框即可。Spry可折叠面板Sp

24、ry效果“Spry效果”是视觉增强功能，可应用于使用JavaScript的HTML页面上几乎所有的元素。要向某个元素应用效