DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript綜合知識 >> Javascript實現帶關閉按鈕的網頁漂浮廣告代碼
Javascript實現帶關閉按鈕的網頁漂浮廣告代碼
編輯:JavaScript綜合知識     

 帶有關閉功能的漂浮圖片的實現方法有很多,下面為大家介紹下使用Javascript是如何實現的,喜歡的額朋友可以了解下

 代碼如下: <html>  <head>  <meta http-equiv="Content-Type" content="text/html; charset=gb2312">  <title>帶關閉按鈕的網頁漂浮廣告代碼</title>  </head>  <body>  <div id="img" style="position: absolute; left: 311; top: 815;visibility :hidden;" onmouseover="clearInterval(interval)" onmouseout="interval = setInterval('changePos()', delay)" align="right">  <a href="#" target="_blank"><img border="0" src="圖片路徑" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/></a>  <span style="CURSOR:hand;color:red;font-weight:bold" onclick="clearInterval(interval);img.style.visibility = 'hidden'">X</span>  </div>  <script language=javascript src=ff.js>    </script>  </body>  </html>    ff.js代碼  代碼如下: var xPos = 20;  var yPos = document.body.clientHeight;  var step = 1;  var delay = 30;  var height = 0;  var Hoffset = 0;  var Woffset = 0;  var yon = 0;  var xon = 0;  var pause = true;  var interval;  img.style.top = yPos;  function changePos() {  width = document.body.clientWidth;  height = document.body.clientHeight;  Hoffset = img.offsetHeight;  Woffset = img.offsetWidth;  img.style.left = xPos + document.body.scrollLeft;  img.style.top = yPos + document.body.scrollTop;  if (yon) {  yPos = yPos + step;  }  else {  yPos = yPos - step;  }  if (yPos < 0) {  yon = 1;  yPos = 0;  }  if (yPos >= (height - Hoffset)) {  yon = 0;  yPos = (height - Hoffset);  }  if (xon) {  xPos = xPos + step;  }  else {  xPos = xPos - step;  }  if (xPos < 0) {  xon = 1;  xPos = 0;  }  if (xPos >= (width - Woffset)) {  xon = 0;  xPos = (width - Woffset);  }  }  function start() {  img.style.visibility = "visible";  interval = setInterval('changePos()', delay);  }  start(); 
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved