参考地址 http://www.leyikao.com
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>浮动广告</title>
<script src="http://www.leyikao.com/templets/default/js/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
(function($) {
jQuery.fn.imgFloat = function(options) {
var own = this;
var xD = 0;
var yD = 0;
var i = 1;
var settings = {
speed: 10,
xPos: 0,
yPos: 0
};
jQuery.extend(settings, options);
var ownTop = settings.xPos;
var ownLeft = settings.yPos;
own.css({
position: "absolute",
cursor: "pointer"
});
function imgPosition() {
var winWidth = $(window).width() - own.width();
var winHeight = $(window).height() - own.height();
if (xD == 0) {
ownLeft += i;
own.css({
left: ownLeft
});
if (ownLeft >= winWidth) {
ownLeft = winWidth;
xD = 1;
}
}
if (xD == 1) {
ownLeft -= i;
own.css({
left: ownLeft
});
if (ownLeft <= 0) xD = 0;
}
if (yD == 0) {
ownTop += i;
own.css({
top: ownTop
});
if (ownTop >= winHeight) {
ownTop = winHeight;
yD = 1;
}
}
if (yD == 1) {
ownTop -= i;
own.css({
top: ownTop
});
if (ownTop <= 0) yD = 0;
}
}
var imgHover = setInterval(imgPosition, settings.speed);
own.hover(function() {
clearInterval(imgHover);
},
function() {
imgHover = setInterval(imgPosition, settings.speed);
});
}
})(jQuery);
</script>
<script>
$(document).ready(function() {
$("#img").imgFloat({speed:30,xPos:10,yPos:10});
});
</script>
<div id=img><a href='http://www.leyikao.com/t/beiligong/'><img src="http://www.leyikao.com/templets/default/Images/bjlgdx.gif"></a></div>
</body>
</html>
参考地址 http://www.leyikao.com
分享到：
相关推荐
今天我们要来分享一款非常大气的jQuery/CSS3全屏焦点图插件，这款焦点图有以下几个特点：首先图片可以全屏切换滑动，显得非常大气；其次焦点图有缩略图导航，点击缩略图可以切换至相应的图片；最后就是图片有阴影，...
62.Supersized jQuery全屏相册图片自动切换插件 63.[荐]jquery仿flash漂亮横向图片滚动效果完整版(兼容性非常好) 64.[荐]jQuery焦点图幻灯切换插件Tab选项卡(soChange 1.4)下载 65.一款jQuery仿flash放大图片...
一款基于jQuery SVG+CSS3实现的右下角图标菜单代码，点击右下角浮动按钮展示图标菜单，再点击图标菜单则打开该菜单内容展示区，打开关闭菜单项的过程中还伴随着很棒的动画效果。
jQuery缓缓弹出广告是一款默认浮动层从上慢慢滑动到页面中间的浮动层代码。
Sticky Sidebar这款jQuery可以让你设置浮动的侧栏，当页面滚动的时候能固定的设定的位置，看起来像是粘住了一样。兼容IE6-9及其它主流浏览器。 WaypointWaypoints 可以帮助你很容易的实现滚动到某个元素的时候执行某...
I jQuery右侧晨浮框控制楼层切换-改良版 ToolTip浮动提示框效果 京东楼层 3D切换效果 icebox焦京图 R bootstrap-datetimepicker-masterzip CSs3动画效果自动登录表单zip CS3给图片添加旋转背景特效zip csS3立体式3D...
asprain论坛支持多种论坛广告形式，包括页头广告、页脚广告、帖子中的文字广告、帖子右边的图片广告、全屏浮动广告、左右对联广告、页面右下角的弹出广告等。所有的广告位都支持循环轮播。也就是说，你可以在同一个...
一款非常大气的jQuery/CSS3全屏焦点图插件，这款焦点图有以下几个特点：首先图片可以全屏切换滑动，显得非常大气；其次焦点图有缩略图导航，点击缩略图可以切换至相应的图片；最后就是图片有阴影，配合天空白云的...
14_1.htm 页面全屏显示。 14_2.htm 显示器检测代码（给出提示）。 14_3.htm 浏览器检测后自动跳转相应界面。 14_4.htm 检测浏览器相应版本。 14_5.htm 页面停留时间1。 14_6.htm 页面停留时间2。 14_7....
14_1.htm 页面全屏显示。 14_2.htm 显示器检测代码（给出提示）。 14_3.htm 浏览器检测后自动跳转相应界面。 14_4.htm 检测浏览器相应版本。 14_5.htm 页面停留时间1。 14_6.htm 页面停留时间2。 14_7....
浮动的广告 嵌套在html中 各种EJB之间的调用示例 7个目标文件 摘要:Java源码,初学实例,EJB调用实例 各种EJB之间的调用源码示例，用远程接口的引用访问EJB、函数将被FirstEJB调用，同时它将调用secondEJB 基于...
浮动的广告 嵌套在html中 各种EJB之间的调用示例 7个目标文件 摘要:Java源码,初学实例,EJB调用实例 各种EJB之间的调用源码示例，用远程接口的引用访问EJB、函数将被FirstEJB调用，同时它将调用secondEJB 基于...