微信公众号 
图码生活

每天发布有五花八门的文章,各种有趣的知识等,期待您的订阅与参与
电脑报 1992-2001 十年文章全集
电脑报 1992-2001 十年文章全集
包含从 1992 年 - 2001 年间,两万余篇期刊文章,查询最少输入两个字符
随便看看
读取中
读取中
标题用Java Script实现网页摇晃效果
栏目网络与通信
作者弈云
发布2001年3期
  众所周知,要提高网站的访问量,增加人气值,不但网站的内容要精彩、更新的速度要快,网站的设计也是个重要因素,一般我们用Java Script语言来设计网页中的特效,往往用简单的手段,就能实现意想不到的效果。
  去年CLIO大奖的获得者是通用公司的雪弗兰汽车广告。这是一个很有创意的网上Banner,名为Shake(摇晃),旨在宣传通用雪弗兰型号为S-10 pickup的客货两用车。该车具有越野性好、马力强劲、驾驶及乘坐空间舒适的特点。该广告摒弃了一般汽车广告中汽车与美女、漂亮的外观、飞驰的车身等传统的宣传方式,而是采用了一个该车车头的大特写,车头剧烈地晃动和中间硕大的雪弗兰标志给人以强烈的视觉感受,更为赞不绝口的是,当你把鼠标移到这个flash banner上时,画面突然切换到了汽车内部,车子在继续地抖动,而且整个浏览器都跟着晃动了起来……。请注意,是整个浏览器在晃动。(

)
  意想不到的效果给人以一种强烈地视觉冲击,使人有身临其境之感,广告的意境瞬间达到了高潮,达到了预期的效果。有兴趣的朋友可上网查看具体的效果(http://www.wisecast.com/review/clio_03.html)。
  其实,这个使整个浏览器晃动起来的特效,也是用Java Script语言来实现的,看上去很难,其实比较简单,我也制作了一个类似的效果,大家只要把下面的内容存成一个HTML文件,就可体会出个中奥秘了(后面是整个页面的源代码,给大家参考)。其中“1.jpg”为图片文件,大家也可用其他图片代替,浏览时,当把鼠标移到图片上时,整个浏览器也跟着晃动起来,而且不停地晃动,当鼠标离开图片时,晃动停止,浏览器逐渐平静下来。
  <html>
  <head>
  <title>晃动的网页</title>
  </head>
  <body>
  <script language=“JavaScript”>
  <!--
  function surfto (form){
  var myindex=form.select1.selectedIndex
  if (form.select1.options[myindex].value!= null){ 
  parent.main.location.href=form.select1.options[myindex].value;
  }
  }
  // -->
  </script>
  <script language=“JavaScript1.2”>
  <!--
  function shake(n){
  if (window.top.moveBy){ 
  for(i = 10; i > 0; i--){ 
  for(j = n; j > 0;j--){ 
  window.top.moveBy(0,i)
  window.top.moveBy(i,0)
  window.top.moveBy(0,-i)
  window.top.moveBy(-i,0)
  }
  }
  }
  }
  // End -->
  </script>
  <script
  language=“JavaScript”>
  <!--
  function moyamoya(htmlfile){ 
  parent.main.location.href=htmlfile;
  }
  // -->
  </script>
  <p align=“center”><img border=“0” onmousemove=shake(10) src=“1.jpg” width=“150” height=“100”></p>
  </body>
  </html>