日期:2014-05-16 浏览次数:20495 次
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Float</title> <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script> <script type="text/javascript" src="js/floatUI.js"></script> <script type="text/javascript"> $(function(){ //调用漂浮插件 $("body").floatUI({ openStyle : 0, speed : 10 }); }) </script> </head> <body> </body> </html> 还有一个js插件 [code=JScript] (function($){ $.fn.floatUI = function(options){ var defaults = { viewStyle : 1 , //漂浮浏览区域 1 用户可视范围(浏览器可视范围) 2 浏览器全部范围(包含滚动部分) imgSrc : "http://wenwen.soso.com/p/20100204/20100204193850-483274619.jpg", //漂浮图片路径 imgJumpToUrl : "http://www.baidu.com", //图片点击跳转页 openStyle : 0, //跳转页打开方式 0为新页面打开 1为当前页打开 speed : 10 //漂浮速度 单位毫秒 }; var options = $.extend(defaults,options); document.writeln("<div id=\"ad\" style=\"position:absolute;left:0px;top:0px;z-index:1000000;cleat:both;\">"); var baseHtml; if(options.openStyle == 0){ baseHtml = "<a href='"+options.imgJumpToUrl+"' target='_blank'><img src='"+options.imgSrc+"' border='0'/></a>"; document.write(baseHtml); }else if(options.openStyle == 1){ baseHtml = "<a href='"+options.imgJumpToUrl+"'><img src='"+options.imgSrc+"' border='0'/></a>"; document.write(baseHtml); } document.write('</div>'); // $("body").html('<div id=\"ad\" style=\"position:absolute;left:0px;top:0px;z-index:1000000;cleat:both;\"><a href="#"><img src="http://wenwen.soso.com/p/20100204/20100204193850-483274619.jpg" border="0"/></a></div>'); if(document.getElementById("ad")){ var x = 50,y = 60 ; var xin = true, yin = true ; var step = 1 ; var obj = document.getElementById("ad"); var float = function(){ var L = T = 0; var R= document.body.clientWidth-obj.offsetWidth; var B = document.body.clientHeight-obj.offsetHeight; obj.style.left = x + document.body.scrollLeft; obj.style.top = y + document.body.scrollTop; x = x + step*(xin?1:-1); if (x < L) { xin = true; x = L } if (x > R){ xin = false; x = R } y = y + step*(yin?1:-1); if (y < T) { yin = true; y = T } if (y > B) { yin = false; y = B } } var itl = setInterval(float,options.speed); } obj.onmouseover=function(){clearInterval(itl)} obj.onmouseout=function(){itl=setInterval(float, options.speed)} }; //floatUI })(jQuery);