`

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

 
阅读更多
 
  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("mdiv.filters.wave.phase+=10",100); 
  } 
  if (document.all) 
  { 
    document.write('<img id=mdiv 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.ccjol.com')">进入</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"> 
  <div align="center">很酷吧!</div> 
  </td> 
  </tr> 
  </table> 
分享到:
评论

相关推荐

    HTML知识整理、网页制作基础教程 CHM.rar

     网页常用特效整理:高级篇  网页常用特效整理:中级篇  表格使用的常见问题及解决方法  活用表格美化网页  网页表格制作进阶  创建网页表格的基本原则和方法  制作1px边框表格的几种方法  有关表格...

    网页制作基础教程

    提高页面显示速度的秘技 用CSS使网页图片半透明 网页小技巧:随心所欲的分隔线 <br> 网页常用特效整理:初级篇 网页常用特效整理:高级篇 网页常用特效整理:中级篇 <br> <br>表格...

    30个网页常用特效打包

    本资源“30个网页常用特效打包”提供了一整套精心整理的网页FLASH特效,旨在帮助网页设计师快速创建出吸引眼球、交互性强的网页元素。这些特效涵盖了从简单的过渡动画到复杂的用户交互效果,为网页增添生动性与趣味...

    javascript常用网页效果整理集合 js效果源码集合

    这个"javascript常用网页效果整理集合"提供了一系列的JS效果源码,可以帮助开发者快速实现各种常见功能,提升网页用户体验。 1. **日历插件**:JavaScript日历插件是网页中常见的一种组件,常用于日期选择、事件...

    真实整理305个前端JS特效代码源码,并非虚标1500个那种资源

    这些特效代码源码涵盖了JS的基本用法和高级技巧,包括动画、事件处理、数据操作等多个方面。 描述中提到的"JS+CSS特效"是指结合JavaScript和CSS来实现的特效。CSS负责网页的样式和布局,而JavaScript可以动态改变...

    25.图像特效处理之素描、怀旧、光照、流年以及滤镜特效1

    本系列文章的作者通过深入研究和实践,将这些知识整理成文,旨在帮助读者掌握图像处理的基础和高级技巧。配合源代码,读者可以动手实践,加深理解。记得在阅读和使用这些资源时,尊重原创,注明引用来源。通过不断的...

    WindowsXP终极优化设置(精心整理篇)

    - 通过“服务”管理工具(services.msc),禁用那些不常用的服务,如“Windows Messenger”等,可以减少系统资源的消耗。 以上就是针对 Windows XP 的一些优化设置技巧,通过这些设置,可以使系统运行得更加流畅、...

    photoshop技能黄金版--呕心沥血整理--从无到有就这么简单--内含多种特效画笔

    "Photoshop技能黄金版--呕心沥血整理--从无到有就这么简单--内含多种特效画笔"是一个集合了丰富的Photoshop教程和资源的压缩包,旨在帮助用户从基础到进阶全面掌握Photoshop的各项技能。 首先,让我们来看看压缩包...

    after effects zi yuan

    - **高级特效应用**: - **粒子系统**:创建复杂的粒子效果。 - **光线跟踪**:实现逼真的光照效果。 - **颜色校正**:精细调整画面色彩。 - **脚本与插件**: - **脚本编写**:使用 JavaScript 编写自定义...

    Mac OS X 使用教程

    - **网页浏览技巧**:提供关于如何高效使用Safari浏览器浏览网页的技巧,包括标签页管理、书签同步等。 - **安全与隐私设置**:介绍如何在Safari中设置安全和隐私选项,保障用户的上网安全。 - **扩展程序安装**:...

    win7完整优化提速

    - 关闭视觉效果:在“控制面板”>“系统”>“高级系统设置”的“高级”选项卡下,选择“调整为最佳性能”可以降低视觉效果,从而提高系统速度。 - 调整电源计划:设置为“高性能”模式,或者自定义电源设置,减少...

    游戏蛮牛教程1-8季整理版

    - **特效制作**:游戏特效的设计与实现。 #### 学习目标 - 掌握游戏美术设计的基本理论知识。 - 学会使用 3D 建模软件进行角色建模。 - 熟悉游戏材质与贴图的制作方法。 - 掌握游戏角色动画的制作技巧。 以上是...

    windows 7 产品指南

    2. 磁盘碎片整理:内置的磁盘碎片整理工具得到了改进,能够更高效地分析和整理硬盘,提高系统运行速度。 3. ReadyBoost:通过使用USB闪存驱动器或SD卡进行缓存,ReadyBoost可以提升系统性能,特别是对于内存较小的...

    详细易懂的xp优化秘籍

    1. 调整视觉效果:在“系统属性”的“高级”选项卡中,选择“调整为最佳性能”,可关闭一些视觉特效,提高系统响应速度。 2. CPU优先级分配:某些程序可能需要更高的CPU资源,可以通过“任务管理器”的“进程”选项...

    电脑维护鲜为人知的75个小技巧电脑维护鲜为人知的75个小技巧电脑维护鲜为人知的75个小技巧电脑维护鲜为人知的75个小技巧

    12. 定期磁盘碎片整理:对于机械硬盘,定期进行磁盘碎片整理有助于优化读写速度。 13. 开启自动更新:确保软件及时获得安全补丁和功能更新。 14. 调整视觉效果:降低特效可以提升性能,尤其在老旧电脑上。 15. ...

    Adobe.Premiere.Pro1_5标准培训教材

    - **第三方插件**: 介绍常用的第三方特效插件。 #### 11. Premiere Pro 1.5制作字幕 - **使用字幕窗口工具箱**: 创建和编辑字幕的方法。 - **风格化设置**: 自定义字幕的外观。 - **绘制图形**: 在字幕中添加图形...

Global site tag (gtag.js) - Google Analytics