js懸浮廣告_求個左下角JS廣告懸浮代碼

A. js 代碼，隨頁面滾動而滾動的浮動廣告效果（帶關閉按鈕）

隨滾動而滾動，css就可以實現，也就是固定在屏幕固定位置，用 position:fixed;即可，關閉按鈕可以版用document.getElementById('').style.display='none';即可，如
<div style="width:500px; height:200px; background-color:#F00;position:fixed;left:100px;top:200px;" id="test">
<button onclick="document.getElementById('test').style.display='none';">關閉</button>
</div>
其中left和top都是權相對於屏幕的位置

B. JS漂浮廣告代碼

給個簡單的也需引入jquery
Html:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(function(){
$('#showWin').click(showWin);
function showWin(){
$('#floatWin').show('slow');
}
})
</script>
</head>
<body>
<button id="showWin">顯示窗口</button>
<div id="floatWin"
style="right:0px;bottom:0px;display:none; width: 200px;height: 200px; background-color: #cccccc;position: absolute;">
</div>
</body>
</html>

最近項目里正好有類似需求代碼給出來供你研究下需要jQuery支持
有什麼疑問可以hi我
(function(){
$(function(){
$.ajax({
url: messagePath+'messageBox.do',
// dataType:'json',
success:function(json){
alert(json);
showMessages(json);
}
});
})
function showMessages(json){
if(json.messagecount>0){
var messageBox ="<div id=\"OTOS_MESSAGEBOX_CONTAINER\">"+
" <table id=\"OTOS_MESSAGEBOX_HEADER\" width=\"100%\" cellpadding=\"0\" cellspacing=\"0\">"+
" <tr>"+
" <td id=\"OTOS_MESSAGEBOX_HEADER_TEXT\"></td>"+
" <td align=\"right\" width=\"20\"><img id=\"OTOS_MESSAGEBOX_CLOSE\" style=\"cursor: pointer;\" src=\"resources/images/close.gif\"></td>"+
" </tr>"+
" </table>"+
" <table id=\"OTOS_MESSAGEBOX_CONTEXT_TITLE_TABLE\" width=\"100%\">"+
" <tr id=\"OTOS_MESSAGEBOX_CONTEXT_TABLE_HEADER\">"+
" <td>標題</td>"+
" <td width=\"50\">類型</td>"+
" <td width=\"40\">發送人</td>"+
" </tr>"+
" </table>"+
" <div id=\"OTOS_MESSAGEBOX_CONTEXT\">"+
" <table id=\"OTOS_MESSAGEBOX_CONTEXT_TABLE\" width=\"100%\"></table>"+
" </div>"+
"</div>";
$('body').append(messageBox);
// $('#OTOS_MESSAGEBOX_CONTAINER').jqDrag("#OTOS_MESSAGEBOX_HEADER");
$('#OTOS_MESSAGEBOX_HEADER_TEXT').text("您有"+json.messagecount+"條未讀消息!");
$('#OTOS_MESSAGEBOX_CLOSE').bind('click',closeMessageBox);
$('#OTOS_MESSAGEBOX_CONTAINER').show('slow');
for(var i=0;i<json.list.length;i++){
var map = json.list[i];
$('#OTOS_MESSAGEBOX_CONTEXT_TABLE').append("<tr onClick=\"toViewMessage("+map.id+",+"+map.mid+")\" class=\"OTOS_MESSAGEBOX_CONTEXT_TABLE_TR\"><td>"+cutTitle(map.title)+"</td><td width=\"50\" nowarp>"+map.type+"</td><td width=\"40\">"+map.sender+"</td></tr>");
}
$('#OTOS_MESSAGEBOX_CONTEXT_TABLE').verticalRoll({parentid:'OTOS_MESSAGEBOX_CONTEXT'});
}
}
// 縱向滾動
$.fn.verticalRoll = function(options) {
var opts = $.extend({}, $.fn.verticalRoll.defaults, options);
if(!opts.parentid||$('#'+opts.parentid).size()<1){
alert('父級不存在');
return false;
}
var $p = $('#'+opts.parentid);
var $t = $(this);
if($t.attr('tagName')!='TABLE'){
alert('不是table');
return false;
}
var s = $t.find('tr').size()
$p.css('overflow','hidden');
$t.css('position','absolute');
if(s>5){
window.setInterval(function(){
var temp = $t.find('tr:first');
temp.fadeOut('slow',function(){
$t.append(temp);
temp.show();
})
},2000)
}else{
return false;
}
$.fn.verticalRoll.defaults = {}
}
})(jQuery);
function closeMessageBox(){
$('#OTOS_MESSAGEBOX_CONTAINER').hide('slow');
$('#OTOS_MESSAGEBOX_CONTAINER').fadeOut();
}
function cutTitle(title){
var temp;
if(title.length>8){
temp = title.substring(0,8)+"...";
return temp
}else{
return title;
}
}
function toViewMessage(id,rid){
window.location.href = "messagesUserList.do?id="+id+"&rid="+rid;
}
Css文件
@CHARSET "UTF-8";

#OTOS_MESSAGEBOX_CONTAINER {
position: absolute;
width: 240px;
height: 145px;
border: 1px solid #81b8ff;
background-color: #deecfd;
right: 0px;
bottom: 0px;
overflow:hidden;
display: none;
}
#OTOS_MESSAGEBOX_CONTAINER TD{
white-space: nowrap;
overflow: hidden;
height: 18px;
}
#OTOS_MESSAGEBOX_HEADER {
cursor: move;
border-bottom: 1px solid #81b8ff;
background-color: #9ACDFE;
overflow:hidden;
}
#OTOS_MESSAGEBOX_HEADER td {
padding: 2px;
color: #ffffff;
overflow:hidden;
}

#OTOS_MESSAGEBOX_CONTEXT {
position: relative;
height: 102px;
overflow:hidden;
}
#OTOS_MESSAGEBOX_CONTEXT td{
white-space: nowrap;
overflow: hidden;
}
#OTOS_MESSAGEBOX_HEADER_TEXT {
font-weight: bold;
overflow:hidden;
}

#OTOS_MESSAGEBOX_FOOTER {
position: relative;;
bottom: 0px;;
padding-right: 2px;;
text-align: right;
overflow:hidden;
}
.OTOS_MESSAGEBOX_CONTEXT_TABLE_TR{
cursor:pointer;
color: #336699;
overflow:hidden;
}
#OTOS_MESSAGEBOX_CONTEXT_TABLE_HEADER td{
overflow:hidden;
font-weight: bold;
overflow:hidden;
}

C. 如何用JS實現關閉瀏覽器窗口強制彈出廣告窗口（退彈代碼)

退彈網頁JS代碼如下:// JavaScript Document代碼專結束.代碼使用方法:將上述代碼復制進txt文檔,將後屬綴名改為.js,上傳至網頁空間.在需要退彈的網頁<body>與</body>之間加入如下代碼:<script language='Javascript' src='js腳本存放相對路徑'></script>

D. 請提供JS漂浮廣告代碼!謝謝!

你先把這個JS文件下下來：http://images.chinaz.com/js/INDEX.js
演示效果就是http://www.chinaz.com/上面的那個漂浮廣告

至於調用代碼，就是<script language=JavaScript src="http://images.chinaz.com/js/INDEX.js"></script>
你把裡面的這個換成你自己的

另外你要修改http://images.chinaz.com/js/INDEX.js里的圖片地址和連接地址，很容易的

E. 求個左下角JS廣告懸浮代碼

漫遊於網路之間，你會發覺，網際網路不但是信息的海洋，也是廣告的海洋。除了普通的Gif Banner、Flash外，浮動廣告也是時下網上較為流行的廣告形式之一。當你拖動瀏覽器的滾動條時，這種在頁面上浮動的廣告，可以跟隨屏幕一起移動。盡管這種效果對於廣告展示有相當的實用價值，但對瀏覽你網頁的人來講，這則是個既妨礙閱讀，又影響閱讀興趣的東西，因此一定不能濫用。不過，如果你能善用的話，它就能發揮出極大的作用。
要做出浮動式廣告的效果並不困難，如果你有JS基礎的可以自己寫一個，如果連寫都懶得寫的話，到網上下載一個特效工具，按提示粘貼一下代碼就OK。不過，想要真正了解它是怎樣做出來的，則需要掌握一些JS知識了。這里向大家介紹一下簡單的浮動廣告做法。
以下這段代碼可放在<body></body>之間，其間我加入了一些注釋（即「//」後的文字及「<!—」「-->」之間的文字）。
<SCRIPT FOR=window EVENT=onload LANGUAGE="JScript">
initAd();//載入頁面後，調用函數initAd()
</SCRIPT>
<script language="JScript">

</script>

<div id=AdLayer style='position:absolute; width:61px; height:59px; z-index:20; visibility:hidden;; left: 600px; top: 300px'>
<a href=" http://www.5dmedia.com/bbs"><img src='../qqkk2000.gif' border="0" height="60" width="60"></a>
</div>
在這里，你可以設置x、y的值來設定所固定層的位置，改變setTimeout("MoveLayer('AdLayer');", 20)中20的值為你希望調用MoveLayer()的時間間隔。還有要注意的是，使用的圖片最好為透明背景的gif圖，以使圖片的背景顏色不至於遮住後面的的內容。
切記，要慎用浮動式廣告，考慮使用特效的同時，千萬要考慮到瀏覽者的感覺，不能濫用哦！

F. 求一個頁面上漂浮著兩個浮動廣告的js代碼

<html>
<head>
<title>漂浮的圖片</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<script language="JavaScript" SRC="moveobj.js"> </script>
<script>

var chip1;
var chip2;
var chip3;
//根據使用的圖片的多少增加或減少上面相應代碼；

function pagestart()
{checkbrOK();
chip1=new Chip("chip1",160,80);
chip2=new Chip("chip2",60,80);
//根據使用的圖片的多少增加或減少上面的相應代碼
if(brOK)
{ movechip("chip1");
movechip("chip2");
//根據使用的圖片的多少增加或減少上面的相應代碼
}
}
</script>

<link rel="stylesheet" href="../style.css">

<body onLoad="pagestart();" onUnload="if(brOK) {stopme('chip1'); stopme('chip2');}" bgcolor="#FFFFFF" text="#000000" >
<DIV ID="chip1" STYLE="position:absolute; width:47; height:68;">
<A HREF="rm/ad1.htm"><IMG SRC="ballon1.jpg" BORDER=0></a>
</DIV>
<DIV ID="chip2" STYLE="position:absolute; width:47; height:68;">
<A HREF="rm/ad2.htm"><IMG SRC="ballon2.jpg" BORDER=0></a>
</DIV>
<center>
<p>
<script src="moveobj.js"></script>
</center>
</body>
</html>

G. 求段網頁右下角漂浮的JS代碼，放廣告用的！

<!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>
<FCK:meta http-equiv="content-type" content="text/html;charset=gb2312" />
<style type="text/css">
#msg_win{border:1px solid #A67901;background:#EAEAEA;width:300px;position:absolute;right:0;font-size:12px;font-family:Arial;margin:0px;display:none;overflow:hidden;z-index:99;}
#msg_win .icos{position:absolute;top:2px;*top:0px;right:2px;z-index:9;}
.icos a{float:left;color:#833B02;margin:1px;text-align:center;font-weight:bold;width:14px;height:22px;line-height:22px;padding:1px;text-decoration:none;font-family:webdings;}
.icos a:hover{color:#fff;}
#msg_title{background:#FECD00;border-bottom:1px solid #A67901;border-top:1px solid #FFF;border-left:1px solid #FFF;color:#000;height:25px;line-height:25px;text-indent:5px;}
#msg_content{margin:0px;width:300px;height:300px;overflow:hidden;}
</style>
</head>
<body>
<p style="height:1000px;"></p>
<div id="msg_win" style="display:block;top:490px;visibility:visible;opacity:1;">
<div class="icos"><a id="msg_min" title="最小化" href="javascript:void 0" _fcksaverl="javascript:void 0">_</a><a id="msg_close" title="關閉" href="javascript:void 0" _fcksaverl="javascript:void 0">×</a></div>
<div id="msg_title">標題</div>
<div id="msg_content">
<img src="http://www.chinesesavvy.com/export/sites/default/images/stories/images/Subject/2007newyear/chunjie_texttu03.gif" width="300" height="300" border="0"/>
</div>
</div>
<script language="javascript">
var Message={
set: function() {//最小化與恢復狀態切換
var set=this.minbtn.status == 1?[0,1,'block',this.char[0],'最小化']:[1,0,'none',this.char[1],'恢復'];
this.minbtn.status=set[0];
this.win.style.borderBottomWidth=set[1];
this.content.style.display =set[2];
this.minbtn.innerHTML =set[3]
this.minbtn.title = set[4];
this.win.style.top = this.getY().top;
},
close: function() {//關閉
this.win.style.display = 'none';
window.onscroll = null;
},
setOpacity: function(x) {//設置透明度
var v = x >= 100 ? '': 'Alpha(opacity=' + x + ')';
this.win.style.visibility = x<=0?'hidden':'visible';//IE有絕對或相對定位內容不隨父透明度變化的bug
this.win.style.filter = v;
this.win.style.opacity = x / 100;
},
show: function() {//漸顯
clearInterval(this.timer2);
var me = this,fx = this.fx(0, 100, 0.1),t = 0;
this.timer2 = setInterval(function() {
t = fx();
me.setOpacity(t[0]);
if (t[1] == 0) {clearInterval(me.timer2) }
},10);
},
fx: function(a, b, c) {//緩沖計算
var cMath = Math[(a - b) > 0 ? "floor": "ceil"],c = c || 0.1;
return function() {return [a += cMath((b - a) * c), a - b]}
},
getY: function() {//計算移動坐標
var d = document,b = document.body, e = document.documentElement;
var s = Math.max(b.scrollTop, e.scrollTop);
var h = /BackCompat/i.test(document.compatMode)?b.clientHeight:e.clientHeight;
var h2 = this.win.offsetHeight;
return {foot: s + h + h2 + 2+'px',top: s + h - h2 - 2+'px'}
},
moveTo: function(y) {//移動動畫
clearInterval(this.timer);
var me = this,a = parseInt(this.win.style.top)||0;
var fx = this.fx(a, parseInt(y));
var t = 0 ;
this.timer = setInterval(function() {
t = fx();
me.win.style.top = t[0]+'px';
if (t[1] == 0) {
clearInterval(me.timer);
me.bind();
}
},10);
},
bind:function (){//綁定窗口滾動條與大小變化事件
var me=this,st,rt;
window.onscroll = function() {
clearTimeout(st);
clearTimeout(me.timer2);
me.setOpacity(0);
st = setTimeout(function() {
me.win.style.top = me.getY().top;
me.show();
},600);
};
window.onresize = function (){
clearTimeout(rt);
rt = setTimeout(function() {me.win.style.top = me.getY().top},100);
}
},
init: function() {//創建HTML
function $(id) {return document.getElementById(id)};
this.win=$('msg_win');
var set={minbtn: 'msg_min',closebtn: 'msg_close',title: 'msg_title',content: 'msg_content'};
for (var Id in set) {this[Id] = $(set[Id])};
var me = this;
this.minbtn.onclick = function() {me.set();this.blur()};
this.closebtn.onclick = function() {me.close()};
this.char=navigator.userAgent.toLowerCase().indexOf('firefox')+1?['_','::','×']:['0','2','r'];//FF不支持webdings字體
this.minbtn.innerHTML=this.char[0];
this.closebtn.innerHTML=this.char[2];
setTimeout(function() {//初始化最先位置
me.win.style.display = 'block';
me.win.style.top = me.getY().foot;
me.moveTo(me.getY().top);
},0);
return this;
}
};
Message.init();
</script>
</body>
</html>

H. 求一個頁面上漂浮著兩個浮動廣告的js代碼,就是左右兩個類似春聯的條形廣告,能跟隨著頁面上下拉動

你吧DEMO下載下來，看看是怎麼回事。。不要拷貝我貼上來的JS。好吧。。。。
http://www.ijavascript.cn/share/jsad-code-for-couplet-scroll-38.html

可下載DEMO下來自己琢磨一下
JS ：

suspendcode="<DIV id=lovexin1 style='Z-INDEX: 10; LEFT: 6px; POSITION: absolute; TOP: 105px; width: 100; height: 300px;'><img src='images/close.gif' onClick='javascript:window.hide()' width='100' height='14' border='0' vspace='3' alt='關閉對聯廣告'><a href='http://www.makewing.com/lanren/' target='_blank'><img src='images/ad_100x300.jpg' width='100' height='300' border='0'></a></DIV>"
document.write(suspendcode);

suspendcode="<DIV id=lovexin2 style='Z-INDEX: 10; LEFT: 896px; POSITION: absolute; TOP: 105px; width: 100; height: 300px;'><img src='images/close.gif' onClick='javascript:window.hide()' width='100' height='14' border='0' vspace='3' alt='關閉對聯廣告'><a href='http://www.makewing.com/lanren/' target='_blank'><img src='images/ad_100x300.jpg' width='100' height='300' border='0'></a></DIV>"
document.write(suspendcode);

//flash格式調用方法
//<EMBED src='flash.swf' quality=high WIDTH=100 HEIGHT=300 TYPE='application/x-shockwave-flash' id=ad wmode=opaque></EMBED>

lastScrollY=0;
function heartBeat(){
diffY=document.body.scrollTop;
percent=.3*(diffY-lastScrollY);
if(percent>0)percent=Math.ceil(percent);
else percent=Math.floor(percent);
document.all.lovexin1.style.pixelTop+=percent;
document.all.lovexin2.style.pixelTop+=percent;
lastScrollY=lastScrollY+percent;
}
function hide()
{
lovexin1.style.visibility="hidden";
lovexin2.style.visibility="hidden";
}
window.setInterval("heartBeat()",1);

導航:首頁 > 編程語言 > js懸浮廣告

js懸浮廣告

與js懸浮廣告相關的資料

友情鏈接