JS實(shí)現(xiàn)很實(shí)用的對(duì)聯(lián)廣告代碼（可自適應(yīng)高度）

更新時(shí)間：2015年09月18日 09:38:20 作者：企鵝

這篇文章主要介紹了JS實(shí)現(xiàn)很實(shí)用的對(duì)聯(lián)廣告代碼,可實(shí)現(xiàn)固定相對(duì)位置懸浮展示及跟隨屏幕上下滑動(dòng)等功能,具有一定參考借鑒價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了JS實(shí)現(xiàn)很實(shí)用的對(duì)聯(lián)廣告代碼（可自適應(yīng)高度）。分享給大家供大家參考。具體如下：

這是一款很實(shí)用的基于JS+CSS+DIV的網(wǎng)頁(yè)對(duì)聯(lián)廣告代碼，自適應(yīng)網(wǎng)頁(yè)高度，也就是始終保持在一定調(diào)試，這款暫時(shí)沒(méi)有關(guān)閉功能。

運(yùn)行效果截圖如下：

在線演示地址如下：

http://demo.jb51.net/js/2015/js-lr-useful-adv-auto-height-codes/

具體代碼如下：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>簡(jiǎn)潔對(duì)聯(lián)廣告代碼</title>
<script language="JavaScript" type="text/javascript">
lastScrollY=0;
function heartBeat(){ 
var diffY;
if (document.documentElement && document.documentElement.scrollTop)
diffY = document.documentElement.scrollTop;
else if (document.body)
diffY = document.body.scrollTop
else
{/*Netscape stuff*/}
//alert(diffY);
percent=.1*(diffY-lastScrollY); 
if(percent>0)percent=Math.ceil(percent); 
else percent=Math.floor(percent); 
document.getElementById("lovexin12").style.top=parseInt(document.getElementById
("lovexin12").style.top)+percent+"px";
document.getElementById("lovexin14").style.top=parseInt(document.getElementById
("lovexin12").style.top)+percent+"px";
lastScrollY=lastScrollY+percent; 
//alert(lastScrollY);
}
suspendcode12="<DIV id=\"lovexin12\" style='left:2px;POSITION:absolute;TOP:120px;'>ad1</div>"
suspendcode14="<DIV id=\"lovexin14\" style='right:2px;POSITION:absolute;TOP:120px;'>ad2</div>"
document.write(suspendcode12); 
document.write(suspendcode14); 
window.setInterval("heartBeat()",1);
</script>
<style type="text/css">
<!--
#lovexin12,#lovexin14{
width:100px;
height:230px;
background-color:yellow;
border:2px solid red;
}
html,body{
height:800px;
}
#mm{
height:800px;
}
-->
</style>
</head>
<body>
<div id="mm">
基于JS+CSS+DIV的網(wǎng)頁(yè)對(duì)聯(lián)廣告代碼
</div>
</body>
</html>

希望本文所述對(duì)大家的JavaScript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

JavaScript表格常用操作方法匯總
這篇文章主要介紹了JavaScript表格常用操作方法,實(shí)例匯總了javascript中表格操作的創(chuàng)建、添加、刪除、遍歷等常用操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-04-04
JS清除字符串中重復(fù)值的實(shí)現(xiàn)方法
這篇文章主要介紹了JS清除字符串中重復(fù)值的實(shí)現(xiàn)方法,涉及javascript數(shù)組與字符串的遍歷、比較及數(shù)學(xué)運(yùn)算相關(guān)技巧,需要的朋友可以參考下
2016-08-08
正則表達(dá)式中特殊符號(hào)及正則表達(dá)式的幾種方法總結(jié)(replace,test,search)
這篇文章主要是對(duì)正則表達(dá)式中特殊符號(hào)及正則表達(dá)式的幾種方法進(jìn)行了詳細(xì)的總結(jié)介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
2013-11-11
DIV+CSS+JS不間斷橫向滾動(dòng)實(shí)現(xiàn)代碼
不間斷橫向滾動(dòng)想必大家在很多場(chǎng)合都有見(jiàn)過(guò)吧，本文也使用DIV+CSS+JS實(shí)現(xiàn)一個(gè)，感興趣的你可以參考下哈，希望對(duì)你學(xué)習(xí)有所幫助
2013-03-03
原生js實(shí)現(xiàn)密碼輸入框值的顯示隱藏
這篇文章主要為大家詳細(xì)介紹了原生js實(shí)現(xiàn)密碼輸入框值的顯示隱藏，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-07-07
D3.js實(shí)現(xiàn)餅狀圖的方法詳解
相信大家都知道圖表是數(shù)據(jù)圖形化的表示，通過(guò)形象的圖表來(lái)展示數(shù)據(jù)，比如條形圖，折線圖，餅圖等。可視化圖表可以幫助開發(fā)者更容易理解復(fù)雜的數(shù)據(jù)，提高生產(chǎn)的效率和Web應(yīng)用和項(xiàng)目的可靠性?，F(xiàn)在就讓我們大家一起來(lái)學(xué)習(xí)用D3.js來(lái)實(shí)現(xiàn)餅圖的方法，有需要的可以參考借鑒。
2016-09-09
JavaScript的內(nèi)置對(duì)象Date詳解
這篇文章主要為大家介紹了vue組件通信的幾種方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來(lái)幫助
2021-11-11
js Li來(lái)實(shí)現(xiàn)的效果
原理就是利用js控制li的一些樣式，在實(shí)際應(yīng)用中，還需要注意li的list-style屬性。
2008-12-12
Array 重排序方法和操作方法的簡(jiǎn)單實(shí)例
下面小編就為大家簡(jiǎn)單的介紹Array中reverse(),sort(),concat(),slice(),splice()方法的應(yīng)用。一起過(guò)來(lái)看看吧
2014-01-01
layui實(shí)現(xiàn)圖片虛擬路徑上傳,預(yù)覽和刪除的例子
今天小編就為大家分享一篇layui實(shí)現(xiàn)圖片虛擬路徑上傳,預(yù)覽和刪除的例子，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2019-09-09