插件源码:
代码如下 | 复制代码 |
(function($){ $.fn.floatAd = function(options){ var defaults = { imgSrc : "/20100204193850-483274619.jpg", //漂浮图片路径 url : "http://www.111cn.net", //图片点击跳转页 openStyle : 1, //跳转页打开方式 1为新页面打开 0为当前页打开 speed : 10 //漂浮速度 单位毫秒 }; var options = $.extend(defaults,options); var _target = options.openStyle == 1 ? "target='_blank'" : '' ; var html = "<div id='float_ad' style='position:absolute;left:0px;top:0px;z-index:1000000;cleat:both;'>"; html += " <a href='" + options.imgJumpToUrl + "' " + _target + "><img src='" + options.imgSrc + "' border='0' class='float_ad_img'/></a> <a href='javascript:;' id='close_float_ad' style=''>x</a>"; html += "</div>"; $('body').append(html); function init(){ x = x + step *( xin ? 1 : -1 ); y = y + step * ( yin ? 1 : -1 ); yin = false; y = DH-OH-1 ; var left = x ; obj.css({'top':top,'left':left}); init(); }; //floatAd })(jQuery); |
调用非常方便的:
代码如下 | 复制代码 |
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.min.js"></script> <script type="text/javascript" src="floatAd.js"></script> <script type="text/javascript"> $(function(){ //调用漂浮插件 $("body").floatAd({ imgSrc : '20100204193850-483274619.jpg', url:'http://www.111cn.net' }); }) </script> |