当前位置: 首页 > 图文教程 > 网页制作 > HTML/XHTML教程 > 对联广告代码效果之二[鼠标感应]

HTML/XHTML教程
Web浏览器模式的选择机制
XHTML+CSS建站如何调用样式表
HTML5和CSS3新的WEB标准和浏览器支持
HTML代码:网页头部代码全清楚
网页制作:HTML代码编写的30条技巧
HTML教程:link标记的rel属性
网页设计参考:firefox的默认样式
网页设计初学者必看的30个网页制作秘笈
网页制作推荐使用的XHTML标记
网页HTML代码讲解:有序列表和无序列表
IE8开发人员工具的菜单讲解
提高用户体验与新窗口打开网页的关系
解决IE支持HTML5的问题
了解如何减少 reflow 次数
平面设计理论:创造视觉冲击力作品
网页HTML 有序列表ol 和无序列表 ul
HTML Frameset 例子代码
让输入框关闭自动完成(AutoComplete)功能
IE支持HTML5的解决方法
基础 HTML之目录问题(相对路径和绝对路径区别)

HTML/XHTML教程 中的 对联广告代码效果之二[鼠标感应]


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-04   浏览: 95 ::
收藏到网摘: n/a

        现在很多网站广告做的如火如荼,现在我就来介绍一下常见的对联浮动广告效果的代码使用方法,本文介绍的这种效果,在1024*768分辨率下正常显示,在800*600的分辨率下可以自动隐藏,以免遮住页面影响访问者浏览内容,而且与前面一个代码不同的是,当鼠标移动到广告图片上是可以感应显示另外设置好的广告大图效果,下面就是实现效果所需代码:

function bigshow(){
document.all.div_250.style.visibility = 'visible';
document.all.div_80.style.visibility = 'hidden';
}
function bighide(){
document.all.div_80.style.visibility = 'visible';
document.all.div_250.style.visibility = 'hidden';
}

var ad_80= new Array(1);
var ad_250= new Array(1);

 ad_80[0]="<a href=http://www.dfeng.net target=_blank><img src="/upload/tech/20091104/20091104154729_39059724f73a9969845dfe4146c5660e.gif" border=0></a>";
 ad_250[0]="<a href=http://www.dfeng.net target=_blank><img src="/upload/tech/20091104/20091104154730_98b297950041a42470269d56260243a1.gif" border=0></a>";

var imgheight;
var fubioleft;
window.screen.width>800 ? fubioleft=15:fubioleft=15

document.write('<DIV id=floater_left style="Z-INDEX: 25; LEFT:'+fubioleft+'px; WIDTH: 28px;POSITION: absolute; TOP: 42px; HEIGHT: 22px">');

ad_now = new Date();
ad_id= ad_now.getSeconds() %1

 

var adhead1="<div id=div_80 style='position:absolute; width:95px; height:62px; z-index:12' onMouseOver=bigshow();>";
var adhead2="</div><div id=div_250 style='position:absolute;  visibility: hidden; z-index:13;width: 80; height: 60'  onMouseOut=bighide();>";

//var adhead1="<div id=div_80 style='position:absolute; width:95px; height:62px; z-index:20' onMouseOut='//MM_showHideLayers(\"div_250\",\"\",\"hide\")' onMouseOver='MM_showHideLayers(\"div_250\",\"\",\"show\")'>";
//var adhead2="</div><div id=div_250 style='position:absolute; z-index:21;visibility: hidden; width: 80; height: 60' onMouseOver='MM_showHideLayers(\"div_250\",\"\",\"show\")' onMouseOut='MM_showHideLayers(\"div_250\",\"\",\"hide\")'>";

document.write(adhead1+ad_80[ad_id]+adhead2+ad_250[ad_id]+"</div>");

 

document.write ("</div>");
 self.onError=null;
 currentX = currentY = 0; 
     whichIt = null;          
     lastScrollX = 0; lastScrollY = 0;
     NS = (document.layers) ? 1 : 0;
     IE = (document.all) ? 1: 0;     
     function heartBeat() {
      if(IE) {
  diffY = document.body.scrollTop;
  diffX = document.body.scrollLeft; }
             if(NS) {
   diffY = self.pageYOffset; diffX = self.pageXOffset; }
      if(diffY != lastScrollY) {
                     percent = .5 * (diffY - lastScrollY);
                     if(percent > 0) percent = Math.ceil(percent);
                     else percent = Math.floor(percent);
         if(IE) document.all.floater_left.style.pixelTop += percent;
         if(NS) document.floater_left.top += percent;
                     lastScrollY = lastScrollY + percent;
         }
      if(diffX != lastScrollX) {
       percent = .5 * (dif