0

0

网页常用特效整理:高级篇

黄舟

黄舟

发布时间:2016-12-23 14:54:46

|

1604人浏览过

|

来源于php中文网

原创

笔者日积月累了许多精彩、实用的web特效的制作,这些特效几乎都是比较常用的网页特效。现在我就把这些经过整理和修改过的特效分三个级别分别介绍给大家。

  高级篇

  1.不同时间段显示不同问候语

  <script language="javascript">
  <!--
  var text="";   day = new date( );  time = day.gethours( ); 
  if (( time>=0) && (time < 7 ))
    text="夜猫子,要注意身体哦! "
  if (( time >= 7 ) && (time < 12))
    text="今天的阳光真灿烂啊,你那个朋友呢?"
  if (( time >= 12) && (time < 14))
    text="午休时间。您要保持睡眠哦!"
  if (( time >=14) && (time < 18))
    text="祝您下午工作愉快! "
  if ((time >= 18) && (time <= 22))
    text="您又来了,可别和mm聊太久哦!"
  if ((time >= 22) && (time < 24))
    text="您应该休息了!"
  document.write(text)
  //--->
  </script>

  2.水中倒影效果

  <img id="reflect" src="../../你自己的图片文件名" width="175" height="59"> 
  <script language="javascript">
  function f1()
  {
    setinterval("mp.filters.wave.phase+=10",100); 
  }
  if (document.all)
  {
    document.write('<img  id=mp  src="'+document.all.reflect.src+'" 
    style="filter:wave(strength=3,freq=3,phase=0,lightstrength=30)  blur() flipv()">')
    window.onload=f1
  }
  </script>

  3.慢慢变大的窗口

  <script language="javascript">
  <!--
  var windowsheight=100
  var windowswidth=100
  var numx=5
  function openwindow(thelocation){
  temploc=thelocation
  if 
  (!(window.resizeto&&document.all)&&!(window.resizeto&&document.getelementbyid))
  {
    window.open(thelocation)
    return
  }
  windowsize=window.open("","","scrollbars")
  windowsize.moveto(0,0)
  windowsize.resizeto(100,100)
  tenumxt()
  }
  function tenumxt(){
  if (windowsheight>=screen.availheight-3)
    numx=0
  windowsize.resizeby(5,numx)
  windowsheight+=5
  windowswidth+=5
  if (windowswidth>=screen.width-5)
  {
    windowsize.location=temploc
    windowsheight=100
    windowswidth=100
    numx=5
    return
  }
  settimeout("tenumxt()",50)
  }
  //-->
  </script>
  <p><a href="javascript:openwindow('http://www.php.cn')">进入</a>

  4.改变ie地址栏的ie图标

  我们要先做一个16*16的icon(图标文件),保存为index.ico。把这个图标文件上传到根目录下并在首页<head></head>之间加上如下代码:

  <link rel = "shortcut icon" href="index.ico">

    5.让网页随意后退

  <a href="javascript:history.go(-x)">x</a> //把x换成你想要后退在页数
           //把“-”变成“+”就为前进

  6.鼠标指向时弹出信息框

  在<body></body>之间加上如下代码:

  <a href onmouseover="alert('弹出信息!')">显示的链接文字</a>

  7.单击鼠标右键弹出添加收藏夹对话框

  在<body></body>之间加上如下代码:

  <script language=javascript>
  if (document.all)
  document.body.onmousedown=new function("if (event.button==2||event.button==3) 
  window.external.addfavorite('您的网址','您的网站名称)")
  </script>

  8.随机变换背景图象(一个可以刷新心情的特效)

  在<head></head>之间加上如下代码:

  <script language="javascript">
  image = new array(4);   //定义image为图片数量的数组
  image [0] = 'tu0.gif'     //背景图象的路径
  image [1] = 'tu1.gif'
  image [2] = 'tu2.gif'
  image [3] = 'tu3.gif'
  image [4] = 'tu4.gif'
  number = math.floor(math.random() * image.length);
  document.write("<body background="+image[number]+">");
  </script>

  9.鼠标一碰就给颜色看的链接

  在<body></body>之间加上如下代码:

  <p onmousemove="anniu()">你敢碰我,我就给点颜色你看!</p>
  <script language = "vbscript">
  sub anniu
  document.fgcolor=int(256*256*256*rnd)
  end sub
  </script>

  10.从天而降并有幻影效果的窗口

  <head>
  <script language="javascript">
  function move(x) {
  if(self.moveby){
  self.moveby (0,-800);
  for(i = x; i > 0; i--)
  {
  self.moveby(0,3);
  }
  for(j = 200; j > 0; j--){  //如果你认为窗口抖动厉害,就200换成个位数
  self.moveby(0,j);
  self.moveby(j,0);
  self.moveby(0,-j);
  self.moveby(-j,0);
  }
  }
  }
  </scrip>
  <body bgcolor=#ffffff onload=move(280)>
  </body>
  </head>

  11.表格的半透明显示效果

  在<head></head>之间加上如下代码:

  <style>
  .alpha{filter: alpha(opacity=50)}   //50表示50%的透明度
  </style>

  在<body></body>之间加上如下代码:
  <table border="1" width="100" height="62"  class="alpha" bgcolor="#f2a664" >
  <tr>
  <td width="100%" height="62">
  <p align="center">很酷吧!</p>
  </td>
  </tr>
  </table>

 以上就是网页常用特效整理:高级篇的内容,更多相关内容请关注PHP中文网(www.php.cn)!

   

动易网上商城管理系统 2006 Sp6 Build 1120 普及版
动易网上商城管理系统 2006 Sp6 Build 1120 普及版

将产品展示、购物管理、资金管理等功能相结合,并提供了简易的操作、丰富的功能和完善的权限管理,为用户提供了一个低成本、高效率的网上商城建设方案包含PowerEasy CMS普及版,主要功能模块:文章频道、下载频道、图片频道、留言频道、采集管理、商城模块、商城日常操作模块500个订单限制(超出限制后只能查看和删除,不能进行其他处理) 无订单处理权限分配功能(只有超级管理员才能处理订单)

下载

热门AI工具

更多
DeepSeek
DeepSeek

幻方量化公司旗下的开源大模型平台

豆包大模型
豆包大模型

字节跳动自主研发的一系列大型语言模型

通义千问
通义千问

阿里巴巴推出的全能AI助手

腾讯元宝
腾讯元宝

腾讯混元平台推出的AI助手

文心一言
文心一言

文心一言是百度开发的AI聊天机器人,通过对话可以生成各种形式的内容。

讯飞写作
讯飞写作

基于讯飞星火大模型的AI写作工具,可以快速生成新闻稿件、品宣文案、工作总结、心得体会等各种文文稿

即梦AI
即梦AI

一站式AI创作平台,免费AI图片和视频生成。

ChatGPT
ChatGPT

最最强大的AI聊天机器人程序,ChatGPT不单是聊天机器人,还能进行撰写邮件、视频脚本、文案、翻译、代码等任务。

相关专题

更多
AO3官网入口与中文阅读设置 AO3网页版使用与访问
AO3官网入口与中文阅读设置 AO3网页版使用与访问

本专题围绕 Archive of Our Own(AO3)官网入口展开,系统整理 AO3 最新可用官网地址、网页版访问方式、正确打开链接的方法,并详细讲解 AO3 中文界面设置、阅读语言切换及基础使用流程,帮助用户稳定访问 AO3 官网,高效完成中文阅读与作品浏览。

18

2026.02.02

主流快递单号查询入口 实时物流进度一站式追踪专题
主流快递单号查询入口 实时物流进度一站式追踪专题

本专题聚合极兔快递、京东快递、中通快递、圆通快递、韵达快递等主流物流平台的单号查询与运单追踪内容,重点解决单号查询、手机号查物流、官网入口直达、包裹进度实时追踪等高频问题,帮助用户快速获取最新物流状态,提升查件效率与使用体验。

6

2026.02.02

Golang WebAssembly(WASM)开发入门
Golang WebAssembly(WASM)开发入门

本专题系统讲解 Golang 在 WebAssembly(WASM)开发中的实践方法,涵盖 WASM 基础原理、Go 编译到 WASM 的流程、与 JavaScript 的交互方式、性能与体积优化,以及典型应用场景(如前端计算、跨平台模块)。帮助开发者掌握 Go 在新一代 Web 技术栈中的应用能力。

1

2026.02.02

PHP Swoole 高性能服务开发
PHP Swoole 高性能服务开发

本专题聚焦 PHP Swoole 扩展在高性能服务端开发中的应用,系统讲解协程模型、异步IO、TCP/HTTP/WebSocket服务器、进程与任务管理、常驻内存架构设计。通过实战案例,帮助开发者掌握 使用 PHP 构建高并发、低延迟服务端应用的工程化能力。

2

2026.02.02

Java JNI 与本地代码交互实战
Java JNI 与本地代码交互实战

本专题系统讲解 Java 通过 JNI 调用 C/C++ 本地代码的核心机制,涵盖 JNI 基本原理、数据类型映射、内存管理、异常处理、性能优化策略以及典型应用场景(如高性能计算、底层库封装)。通过实战示例,帮助开发者掌握 Java 与本地代码混合开发的完整流程。

1

2026.02.02

go语言 注释编码
go语言 注释编码

本专题整合了go语言注释、注释规范等等内容,阅读专题下面的文章了解更多详细内容。

61

2026.01.31

go语言 math包
go语言 math包

本专题整合了go语言math包相关内容,阅读专题下面的文章了解更多详细内容。

53

2026.01.31

go语言输入函数
go语言输入函数

本专题整合了go语言输入相关教程内容,阅读专题下面的文章了解更多详细内容。

26

2026.01.31

golang 循环遍历
golang 循环遍历

本专题整合了golang循环遍历相关教程,阅读专题下面的文章了解更多详细内容。

31

2026.01.31

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
Node.js 教程
Node.js 教程

共57课时 | 10.1万人学习

Bootstrap4.x---十天精品课堂
Bootstrap4.x---十天精品课堂

共22课时 | 1.7万人学习

进程与SOCKET
进程与SOCKET

共6课时 | 0.4万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号