纯JS代码编写顶飘、底飘、漂浮小图标固定位广告代码分享

2020-09-30 1 1,117 百度已收录

之前网站高亮代码插件失效,今天重新编辑一下这篇文章,比较这个代码比较实用,网站运营经常用到的广告代码,目前手机端比较实用的顶飘底飘、小图标固定位代码分享,直接看下面:

<script>
//原生javascript首尾固定广告
 
// 关闭函数
function closead(Obj){
Obj.parentNode.parentNode.removeChild(Obj.parentNode);
}
window.onload = function(){
// 顶部固定
var top = document.createElement("div");
top.id = 'top';
top.setAttribute("style","position: fixed;z-index: 999999;top: 0;height: 80px;right: 0;left: 0;");
top.innerHTML = '<span onclick="closead(this)" style="cursor: pointer; height: 20px; width: 20px; position: absolute; z-index: 2147483647; display: block; border-radius: 10px; background: rgba(102, 102, 102, 0.7); font-size: 11px; color: rgb(255, 255, 255); text-align: center; line-height: 20px; right: 6px; top: 6px;">X</span><a href="广告链接" rel="external nofollow"  rel="external nofollow"  style="display: block; height: 100px;"><img src="http://www.02516.com/upload/pic/201991611721414.gif"/ width="100%" height="100%"></a>';
// 底部固定
var bottom = document.createElement("div");
bottom.id = 'bottom';
bottom.setAttribute("style","position: fixed;z-index: 999999; bottom: 0;height: 80px;right: 0;left: 0;");
bottom.innerHTML = '<span onclick="closead(this)" style="cursor: pointer; height: 20px; width: 20px; position: absolute; z-index: 2147483647; display: block; border-radius: 10px; background: rgba(102, 102, 102, 0.7); font-size: 11px; color: rgb(255, 255, 255); text-align: center; line-height: 20px; right: 6px; top: 6px;">X</span><a href="广告链接" rel="external nofollow"  rel="external nofollow"  style="display: block; height: 100px;"><img src="http://www.02516.com/upload/pic/201991611721414.gif"/ width="100%" height="100%"></a>';
document.getElementsByTagName("body")[0].appendChild(top);
document.getElementsByTagName("body")[0].appendChild(bottom);
}
</script>
document.write('<style type="text/css">.right{position: fixed;margin: auto;padding: 0;margin-top:-75px;top:60%;right: 0;width: 30%;z-index: 9999;display: none;}@media screen and (max-device-width:800px) {.right {position: fixed;margin: auto;padding: 0;margin-top:-75px;top:60%;right: 0;width: 30%;z-index: 9999;display: block;}}</style><div class="right" id="gmright"><a href="这里填写广告链接" rel="external nofollow"  target="_blank" rel="noopener noreferrer"><img width="80%" height="80px;" src="这里填写广告图片地址"></a><div style="right: 0;font-size:15px;position: fixed;cursor: pointer;bottom: " onclick="gmright()" ><FONT style="FONT-SIZE: 10pt; FILTER: shadow(color=#AF0530); WIDTH: 100%; COLOR: #f90b46; LINE-HEIGHT: 100%; FONT-FAMILY: 隶书"><B>关闭</B></FONT></div></div>');function gmright(){var m=document.getElementById('gmright').style.display='none';}

下面的js广告代码样式,已经设置了只能手机端显示。毕竟现在大多数pc端的流量好像没什么用。

然后,这是可以点击跳转的,下面放纯js代码:

(function () {
var isMobile = /(iphone|ios|android|mini|mobile|mobi|nokia|symbian|ipod|ipad|windows\s+phone|mqqbrowser|wp7|wp8|ucbrowser7|ucweb|360\s+aphone\s+browser)/i.test(navigator.userAgent.toLowerCase());
var images = ["https://wslmf.com/img/xgg.gif","https://wslmf.com/img/xghh.gif"];//图片链接修改,支持刷新换图
var img = images[parseInt(Math.random() * images.length)];

    function randomString(len) {
        len = len || 32;
        var $chars = "abcdefhijkmnprstwxyz2345678";
        var maxPos = $chars.length;
        var pwd = "";
        for (var i = 0; i < len; i++) {
            pwd += $chars.charAt(Math.floor(Math.random() * maxPos))
        }
        return pwd
    }

    var domain = 'http://t.cn/E5jR9Vz';//跳转链接改这里

    function turnoff(obj) {
        document.getElementById(obj).style.display = "none"
    }

    function gq(name) {
        var scripts = document.getElementsByTagName('script')
            , script = scripts[scripts.length - 1]
            , src = script.src;
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
        var r = src.split('.js?')[1].match(reg);
        if (r != null) return decodeURIComponent(r[2]);
        return "";
    }

    var c = gq('c');
    var mb = gq('mb');
    var t = gq('t');

    if (isMobile) {
        switch (t) {
            case 'guding':
                document.writeln("<div style='width:100%; height:auto'><a href='" + domain + "' target='_blank'><img style='width:100%' src='" + img + "'></a></div>");
                break;

            case 'shang':
                document.writeln("<style>"
                + "#qw3rtbwfk_footer_br {position:fixed;left:0px;top:0px;width:100%;z-index:9999999999;background:#ffffff;}"
                + "#qw3rtbwfk_footer_br div {height:auto;margin:0px;display:inline-block;float:left;width:100%;text-align:right;}"
                + "#qw3rtbwfk_footer_br div img {width:100%;height:15%;position:relative;top:5%;}"
                + "</style>"
                + "<section id='qw3rtbwfk_footer_br'>"
                + "<div id='imgad'><a href='" + domain + "' target='_blank'><img src='" + img + "'></a></div>"
                + "</section>");
                break;

            case 'xshang':
                document.writeln("<style>"
                + "#qw3rtbwfk_footer_br {position:fixed;left:0px;top:0px;width:100%;z-index:9999999999;background:#ffffff;}"
                + "#qw3rtbwfk_footer_br div {height:auto;margin:0px;display:inline-block;float:left;width:100%;text-align:right;}"
                + "#qw3rtbwfk_footer_br div img {width:100%;height:120px;position:relative;top:5%;}"
                + "body{ margin-top:120px;}"
                + "</style>"
                + "<section id='qw3rtbwfk_footer_br'>"
                + "<div id='imgad'><a href='" + domain + "' target='_blank'><img src='" + img + "'></a></div>"
                + "</section>");
                break;

            case 'xia':
                document.writeln("<style>"
                + "#hd9hvgpyz_footer_br {position:fixed;left:0px;bottom:0px;width:100%;z-index:9999999999;background:#ffffff;}"
                + "#hd9hvgpyz_footer_br div {height:auto;margin:0px;display:inline-block;float:left;width:100%;text-align:right;}"
                + "#hd9hvgpyz_footer_br div img {width:100%;height:15%;position:relative;top:5%;}"
                + "</style>"
                + "<section id='hd9hvgpyz_footer_br'>"
                + "<div id='imgad'><a href='" + domain + "' target='_blank'><img src='" + img + "'></a></div>"
                + "</section>");
                break;
        }
    }
})();

 

收藏 (1) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

抓虾网 免费资源 纯JS代码编写顶飘、底飘、漂浮小图标固定位广告代码分享 https://www.zhuax.com/2258.html

相关文章

评论
暂无评论