当先锋百科网

首页 1 2 3 4 5 6 7

javascript 广告代码大全

我们都知道在网页中加入广告是一种很常见的方式，为网站赚取一些收入。而要实现这个过程，就需要JavaScript代码的帮助。下面我们介绍几种常见的JavaScript广告代码。

弹出式广告：

window.open("http://example.com/ads.html","mywindow", "status=1,scrollbars=1,width=500,height=500");

这种广告会在用户访问网站时弹出一个新窗口或者选项卡，通常会展示一些带有销售信息的产品或者服务。

悬浮式广告：

<script type="text/javascript">
document.write('<div id="adsDiv"><a href="#" onclick="document.getElementById(\'adsDiv\').style.display=\'none\';"><img src="http://example.com/ads.jpg"></a></div>');
</script>

这种广告会在网站页面的一角悬浮着，通常在鼠标移动到该位置时自动展开。而当用户点击关闭按钮时就会自动关闭。悬浮式广告通常会为产品或服务带来更多的关注。

插入式广告：

<script type="text/javascript" src="http://example.com/ads.js"></script>

这种广告是最常见的一种类型，它会在网站页面底部或其他位置插入一些带有销售信息或者宣传品的图片或文字信息。插入式广告通常使用JavaScript来动态生成，从而实现页面的刷新和展示。

轮播式广告：

<script type="text/javascript">
var currentIndex = 0;//当前图片的索引
var images = ["http://example.com/1.jpg","http://example.com/2.jpg","http://example.com/3.jpg"];
//需要轮播的图片列表
setInterval(function(){
var imgElem = document.getElementById("adImage");
currentIndex = (currentIndex + 1) % images.length;
imgElem.src = images[currentIndex];
}, 5000);
</script>
<img src="http://example.com/1.jpg" id="adImage">

这种广告会在网站页面一定时间内循环展示一组图片列表，通常在图片下方加上一些简短的文字信息或者链接。轮播式广告可以为产品或服务带来持续的关注和曝光。

浮层式广告：

<style>
#mask{
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: #000;
opacity: 0.5;
filter: alpha(opacity=50);
z-index: 10000;
}
#adBox{
position: fixed;
left: 50%;
top: 50%;
width: 500px;
height: 400px;
margin-left: -250px;
margin-top: -200px;
background-color: #FFF;
border: 1px solid #000;
z-index: 10001;
}
</style>
<div id="mask"></div>
<div id="adBox"></div>
<script type="text/javascript">
//在adBox中插入广告信息
document.getElementById("adBox").innerHTML = "<img src='http://example.com/ads.jpg'>";
//关闭广告并隐藏浮层
document.getElementById("mask").onclick = function(){
document.getElementById("adBox").style.display = "none";
document.getElementById("mask").style.display = "none";
};
//延迟展示广告并弹出浮层
setTimeout(function(){
document.getElementById("adBox").style.display = "block";
document.getElementById("mask").style.display = "block";
},5000);
</script>

这种广告是一种全屏的覆盖式广告，会在用户访问网站一段时间后弹出并覆盖整个窗口。浮层式广告通常会为产品或服务带来相对较高的转化率，但也可能会对用户体验造成一些影响。

以上就是一些常见的JavaScript广告代码，每种代码都有其自身的优点和局限性，根据不同的需求和实际情况，我们可以选择合适的广告代码来为网站赚取更多的收入。