注册本站  论坛  繁體中文

电脑技巧
手机 | MP3 | MP4 | 显卡 | 主板 | 显示器 | 光存储 | 笔记本 | 网络设备 | 移动存储 | 数码相机
键鼠 | CPU | 音箱 | GPS | 电视 | 服务器 | 投影机 | 机箱电源 | 品牌电脑 | 办公打印 |
| 网站首页 | Cisco | Windows | Linux | Java | Dotnet | Oracle | 网页设计 | 平面设计 | 安全 | 软件应用 | 电脑维修 | 办公维修 |
您现在的位置: 电脑技巧 >> 网页设计 >> Dreamweaver >> 基础教程 >> 网页设计正文

DW CS3中Spry详细区域的功能

文章来源:网页教学网 作者:RockHwar… 更新时间:2008-8-23 15:35:17 【 】 【加入收藏
  进入网络咨询平台

Dreamweaver CS3中集成了Spry功能我们都知道,Spry具有对XML数据处理的功能我们也见识过,不过对于Spry的详细区域功能似乎很少见。

  Spry详细区域有点类似于新闻系统中的新闻列表页和主详细页的功能。比如我们看新闻时,其中有一个页面只会显示所有新闻的标题,当对该标题感兴趣时可以单击该标题打开一个新的网页,就可以查看到该新闻的全部内容了。那么显示所有标题列表的页面我们称为“主页”,而显示具体新闻内容的页面称为“详细页”。  

  很显然,这个主详细页最起码得是两页。而我们使用的Spry详细区域可以在一张网页上显示,并且是无刷新的。

一,新建网页,绑定Spry XML 数据集

Dreamweaver

  在网页中打开【插入】面板,单击【Spry】标签下的【Spry XML 数据集】

二,选择XML数据源

Dreamweaver

  弹出【Spry XML 数据集】对话框,【XML源】可以是本地目录下的XML数据,也可以是跨域的远程XML数据。单击【获取架构】按钮在【行元素】列表框中选择XML数据中有价值的重复元素,这里就是选择的“item”元素(<>标志右上角有+号表示循环的多个)。P.S 如果制作纯粹的XML数据聚合的页面,还可以选择【禁用XML数据缓存】,并选择自动刷新数据的时间以自动获得远程数据同步。

三,插入Spry表,显示Spry XML数据在页面
  
Dreamweaver

  单击【插入】面板【Spry】标签下的【Spry 表】按钮,弹出的对话框中将不需要显示的【列】进行删除。很重要的一个操作就是一定要选择 单击行时将使用“更新”详细区域。【确定】插入Spry表,提示需要插入Spry区域。因为所有的Spry XML 数据必须在 Spry区域中才能显示。

四,插入Spry详细区域 

Dreamweaver

  首先,鼠标光标停留在已经插入在页面中的“Spry表”之后,继续单击【插入】面板【Spry】标签下的【Spry 区域】按钮。弹出的对话框中【类型】一定要选择为“详细区域”才表示当前是Spry详细区域。

五,将“详细内容”插入Spry详细区域

Dreamweaver

  鼠标光标停留在Spry详细区域内,打开【绑定】面板,选择“description”元素【插入】到Spry详细区域中。
 
Dreamweaver

  保存网页会提示我们保存Spry效果文件,记得上传的时候要连同这些文件一起上传。
  
六,预览效果

Dreamweaver

  跨域显示远程XML数据,同时单击每行标题都能在当前页无刷新打开内容查看,甚好。
  • 上一篇网页设计:

  • 下一篇网页设计:
  • 最 新 热 门
     Flash技巧:用内置组件控制Flv视频!
     FLASH动画制作常用命令大集合
     在Excel中插入Flash动画技巧一则!
     flash动画也能设为桌面
     Flash中如何简单使用钢笔铅笔教程
     Flash制作“小丑吹泡泡”趣味动画
     Flash实战:制作国宝熊猫举重动画
     Flash制作可爱“小青蛙时钟”动画
     Flash实例教程:制作无脚本软翻书动画
     粒子动画效果轻松做
    最 新 推 荐
     Dreamweaver中数据库路径的使用
     DW CS3中Spry详细区域的功能
     Dreamweaver CS4 Beta版初步试用感受
     Dreamweaver入门 如何远程发布你的站点
     Firewoks制作立体黑水晶质感文字
     在Dreamweaver中编写CSS需要掌握的技巧
     Dreamweaver CS3中Spry详细区域功能
     网页设计中的链接和文本标签的应用
     IE8 beta1 中的 CSS 属性
     微软宣布IE8将全面兼容Web网页标准
    相 关 文 章

    Flash CS3:FLV视频短片我来做!
    CSS+DIV标签命名规范
    用CSS控制IE下中英文字体显示对齐
    网站通过W3C CSS标准的一些经验
    CSS一些常见的技巧分享
    简化CSS属性代码,让你的CSS更精简清晰
    CSS如何实现让图片垂直居中
    网页制作了解什么是CSS hack?
    用CSS实现文字环绕图片的效果
    CSS打造阴影文字

    | 设为首页 | 加入收藏 | 联系站长 | 友情链接 | 版权申明 | 网站公告

     

    Copyright 2006-2008 pcjx.com All Rights Reserved
    电脑技巧 版权所有 粤ICP备06059145号 地图
    本网站所有内容未经许可不得转载或做其他使用