动态网站制作指南
[  QQ表情  ]
[ 投票调查 ]
[ 企业邮箱 ]
[ 网站空间 ]
网络编程 | 站长之家 | 网页制作 | 图形图象 | 操作系统 | 冲浪宝典 | 软件教学 | 网络办公 | 邮件系统 | 网络安全 | 认证考试 | 系统进程
ASP源码 | .Net源码 | PHP源码 | JSP源码 | JAVA源码 | CGI源码 | VB源码 | C++源码 | Delphi源码 | PB源码 | VF源码 | 汇编 | 服务器
电脑书籍下载:程序设计书籍 | 数据库教程书籍 | 平面与多媒体书籍 | 网络通讯书籍 | 系统管理书籍 | 网络安全书籍 | 认证考试书籍
Firefox | IE | Maxthon | 迅雷 | 电驴 | BitComet | FlashGet | QQ | QQ空间 | Vista | 输入法 | Ghost | Word | Excel | wps | Powerpoint
asp | .net | php | jsp | Sql | c# | Ajax | xml | Dreamweaver | FrontPages | Javascript | css | photoshop | fireworks | Flash | Cad | Discuz!
当前位置 > 网站建设学院 > 网页制作 > CSS教程
网页制作:Dreamweaver教程,FrontPages教程,Javascript教程,HTML教程,CSS教程,心得技巧,DHTML教程,网页特效,Discuz!论坛
文章搜索服务
邮件订阅
输入你的邮件地址,
你将不会错过任何关于:
[ CSS教程 ]的信息



本月文章推荐
.第六章 区块性质的CSS.
.网页标准化制作:CSS的超级技巧大.
.精通 CSS 滤镜(一).
.网页制作之常用CSS缩写语法总结.
.CSS框架的利与弊.
.解决倾斜鼠标翻转导航制作麻烦问.
.CSS实现导航条图片的翻转菜单.
.纯CSS搞的alt跟title效果.
.CSS:如何编写代码才能更有效率.
.常用CSS.
.CSS Hack汇总快查.
.DIV+CSS常见错误汇总.
.利用css和js实现firefox和IE都支.
.用CSS层叠样式表实现文字变图象特.
.expression将JS、Css结合起来.
.应用DIV+CSS编码时容易犯的一些错.
.CSS里也能写脚本? .
.标记语言:为指定css样式.
.第一章 CSS的基本认识.
.用CSS样式固定表格宽度.

revealTrans滤镜制作超弦图片的播放

文章类别:CSS教程 | 发表日期:2007-11-9 |


      CSS中有revealTrans滤镜在网页中制作特效非常有用处。这次,我们准备介绍另一种使用revealTrans滤镜制作出超弦图片播放的效果。

  实现思路:使用revealTrans滤镜制作出超弦图片播放的效果,并每张图片有各自的链接地址。

  制作方法:

  1、在<head>中插入JS代码:

以下是引用片段:
<SCRIPT language=JavaScript1.2>
function reapply(){
setTimeout("slideit()",800)
return true
}
window.onerror=reapply
</SCRIPT>
<SCRIPT language=JavaScript1.1>
<!--
//preload images
var image1=new Image()
image1.src=图片地址"
var image2=new Image()
image2.src=图片地址"
var image3=new Image()
image3.src=图片地址"
var image4=new Image()
image4.src=图片地址"
var image5=new Image()
image5.src=图片地址"
var image6=new Image()
image6.src=图片地址"
var image7=new Image()
image7.src=图片地址"
var image8=new Image()
image8.src=图片地址"
var image9=new Image()
image9.src=图片地址"
//-->
</SCRIPT>

  其中:images/图片地址为显示图片的路径,可按实际情况修改。

  2、在<body>中插入代码:onload=slideit()

  3、在页面中插入图片。

      并在图片<img>中插入:style="FILTER: revealTrans(Duration=2, Transition=23)",并命名为:name=slide
  完整代码:<img src=连接地址"images/图片地址" width="120" height="90" border="0" style="FILTER: revealTrans(Duration=2, Transition=23)" name=slide>

  4、给图片加超链接:<a href="JavaScript:slidelink()">

  5、加入代码:
以下是引用片段:
<SCRIPT>
<!--
////change number of images below 
var number_of_images=9
//change speed below (in seconds)
var speed=3
var step=1
var whichimage=1
function slideit(){
if (!document.images)
return
if (document.all)
slide.filters.item(0).Apply()
document.images.slide.src=eval("image"+step+".src")
if (document.all)
slide.filters.item(0).Play()
whichimage=step
if (step<number_of_images)
step++
else
step=1
if (document.all)
setTimeout("slideit()",speed*1000+3000)
else
setTimeout("slideit()",speed*1000)
}
function slidelink(){
if (whichimage==1)
top.location.href=图片地址"/index.HTML"
if (whichimage==2)
top.location.href=图片地址"/news.HTML" 
if (whichimage==3)
top.location.href=图片地址"/game.HTML" 
if (whichimage==4)
top.location.href=图片地址"/music.HTML" 
if (whichimage==5)
top.location.href=图片地址"/sport.HTML" 
if (whichimage==6)
top.location.href=图片地址"/radio.HTML" 
if (whichimage==7)
top.location.href=图片地址"/travel.HTML" 
if (whichimage==8)
top.location.href=图片地址"/card.JSP" 
else if (whichimage==9)
top.location.href=图片地址"/study.HTML" 
}
</SCRIPT>


上一篇:应用DIV+CSS编码时容易犯的一些错误 人气:2076
下一篇:css技巧之PDF、ZIP、DOC链接的标注 人气:1788
点击此处浏览全部revealTrans的内容 Dreamweaver插件下载 常用网页广告代码全集
  最新网站源码 最新软件下载
2008-5-20 站长俱乐部新闻发布系统 v5.19
2008-5-20 DotNetTextBox网页编辑器 v3.4.7
2008-5-20 phpMyFAQ v2.5.0 多国语言版
2008-5-20 DreamArticle 文章管理系统 v2.0
2008-5-20 Drupal v7.xdev Build080518
2008-5-20 逐迹内容管理系统AspxNuke v2.0.
2008-5-20 ajax奥运留言本 v1.0
2008-5-20 QQ空间博客全自动挂机互踩好友
2008-5-20 网人采集 v1.2.0
2008-5-7 Windows XP SP3 官方英文版
2008-5-7 Windows XP SP3 官方香港中文版
2008-5-7 Windows XP SP3 官方繁体中文版
2008-5-7 Windows XP SP3 官方简体中文版
2008-4-30 Multiple Unzip Wizard 1.02
2008-4-30 Multiple Unrar Wizard 1.0.0
2008-4-30 WinZip Install/Try/Uninstall a
2008-4-30 ZIP压缩文件修复器WzipFix 2.0
2008-4-30 Pentazip 6.01 Build 189 For Wi
  发表评论
姓 名: 验证码: [ 全部贴吧 ] [ 浏览评论 ]
内 容:
[ 汉字翻译拼音 ] [ 广告代码 ] [ 符号对照表 ] [ 进制转换 ] [ 经典小工具 ] [ 个税计算 ] [ 汉字简繁转换 ] [ 普通单位换算 ] [ 公制单位换算 ]
[ 生辰老黄历 ] [ 国内电话区号 ] [ 国家代码与域名缩写 ] [ 文字加密解密 ] [ 健康查询 ] [ 万年历 ] [ 手机号码查询 ] [ ip搜索 ] [ Google PR查询 ]
业务联系 | 广告刊登 | 频道合作 | 投稿荐稿 | 联系方式 | 加入收藏 | RSS订阅
Copyright © 2000-2008 www.knowsky.com All rights reserved | 网络实名:动态网站制作指南 | 沪ICP备05001343号