网站目录收录网站方式：1.人工手动审核。2.自助审核（你的网站在权重3、PR4以上，挂上本站友链->点击友链->自动审核通过。）
北京 天津 上海 广东 深圳 河北 河南 新疆 重庆 四川 贵州 湖南 湖北 云南 广西 宁夏 青海 甘肃 陕西
西藏 海南 山东 福建 安徽 浙江 吉林 山西 江西 江苏 辽宁 黑龙 内蒙 澳门 香港 台湾 日本 韩国 美国
当前位置：站长啦网站目录 » 新闻资讯 » 站长新闻 » 技术文档 » 文章详细 订阅RssFeed

【代码】jquery漂浮广告代码 PC端

来源：漂浮广告代码　浏览：2520次　时间：2018-10-31
简介：【代码】jquery漂浮广告代码 PC端

【代码】jquery漂浮广告代码 PC端


代码描述：常见网站中的漂浮广告代码，纯jquery语法

演示地址

点击下载



<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jquery漂浮广告代码-jq22.com</title>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<style>
</style>
</head>
<body>
<div id="imgDiv" style="position:absolute;left:50px;top:60px;">
    <div id="a" style="width:20px;height:20px;position:absolute;left:160px;background:salmon;text-align: center;">×</div>
    
    <div style="width:180px;height:180px;background:red;"> <a target="_blank" href="http://sc.chinaz.com/jiaoben/140512132610.htm" alt="jquery性感女性图片广告"><img src="http://pic2.sc.chinaz.com/Files/pic/webjs1/201405/jiaoben2320_s.jpg" alt="jquery性感女性图片广告"></a>
</div>
</div>


<script>
var xin = true,
    yin = true;
var step = 1;
var delay = 10;
var $obj;
$(function() {
    $obj = $("#imgDiv");
    var time = window.setInterval("move()", delay);
    $obj.mouseover(function() {
        clearInterval(time)
    });
    $obj.mouseout(function() {
        time = window.setInterval("move()", delay)
    });
});


function move() {
    var left = $obj.offset().left;
    var top = $obj.offset().top;
    var L = T = 0; //左边界和顶部边界
    var R = $(window).width() - $obj.width(); // 右边界
    var B = $(window).height() - $obj.height(); //下边界
    if (left < L) {
        xin = true; // 水平向右移动
    }
    if (left > R) {
        xin = false;
    }
    if (top < T) {
        yin = true;
    }
    if (top > B) {
        yin = false;
    }
    left = left + step * (xin == true ? 1 : -1);
    top = top + step * (yin == true ? 1 : -1);
    // 给div 元素重新定位
    $obj.offset({
        top: top,
        left: left
    })
}
$(function() {
    $("#a").click(function() {
        var b = $("#a").parent();
        $(b).remove();
    })
})
$("#imgDiv").draggable();
</script>


</body>
</html>




0

版权与免责声明：

凡注明稿件来源的内容均为转载稿或由网友用户注册发布，本网转载出于传递更多信息的目的；如转载稿涉及版权问题，请作者联系我们，同时对于用户评论等信息，本网并不意味着赞同其观点或证实其内容的真实性；


本文地址：https://top.cnzzla.com/artinfo/45071.html

好玩的手游下载

猜你喜欢

推荐站点

  • 福州小程序开发福州小程序开发

    福州好小蚁科技提供专业的微信小程序开发、软件定制、手机APP开发、网站开发等高端定制外包服务，价格美丽,服务周到.一对一项目对接，不满意退全款！预约电话:13107632710 胡小春！福州好小蚁科技有限公司是福建福州网站app等技术开发优秀网络公司。

    www.fzant.com
  • 世界时间网世界时间网

    世界时间网为您提供世界各地精准时间，北京时间校准器，标准时间，世界各地时间与北京时间对比，时间换算等，希望对您有所帮助。

    top.cnzzla.com/time
  • 科技镇科技镇

    科技镇 | 关注科技、娱乐、人文、生活！

    www.kejizhen.com
  • 心动网址导航心动网址导航

    心动网址导航精选了国内国外著名的网站、好玩的、好看的、有趣的国内国外网站以及实用的、优秀的国内国外网站,包括国外视频、国外购物、国外交友、国外新闻等多种类型 同时提供精品行业分类目录提交，让用户全方位了解国内国外互联网动态！

    xd00.com
  • 门户网址-优秀网站导航门户网址-优秀网站导航

    门户网址-优秀网站导航,精选网址导航，免费分类目录提交，实用酷站大全。

    top.mhwz.cn

最新优秀网站