当前位置:首页 > 代码 > 正文

固定时间显示漂浮广告代码(js漂浮广告代码)

admin 发布:2022-12-19 18:59 158


今天给各位分享固定时间显示漂浮广告代码的知识,其中也会对js漂浮广告代码进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在开始吧!

本文目录一览:

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.messagecount0){

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;ijson.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)+"/tdtd width=\"50\" nowarp"+map.type+"/tdtd 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(s5){

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.length8){

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;

}

页面悬浮广告代码

脚本说明:

把如下代码加入body区域中

SCRIPT FOR=window EVENT=onload LANGUAGE="JavaScript"

initAd();//载入页面后,调用函数initAd()

/SCRIPT

script language="JavaScript"

!--

function initAd() {

document.all.AdLayer.style.posTop = -200;

//设置onLoad事件激发以后,广告层相对于固定后的y方向位置

document.all.AdLayer.style.visibility = 'visible'//设置层为可见

MoveLayer('AdLayer');//调用函数MoveLayer()

}

function MoveLayer(layerName) {

var x = 600;//浮动广告层固定于浏览器的x方向位置

var y = 300;//浮动广告层固定于浏览器的y方向位置

var diff = (document.body.scrollTop + y - document.all.AdLayer.style.posTop)*.40;

var y = document.body.scrollTop + y - diff;

eval("document.all." + layerName + ".style.posTop = y");

eval("document.all." + layerName + ".style.posLeft = x");//移动广告层

setTimeout("MoveLayer('AdLayer');", 20);//设置20毫秒后再调用函数MoveLayer()

}

//--

/script

!--下面为一个ID为AdLayer的层(如ID名不为AdLayer,

上面MoveLayer()内的AdLayer也要作相应修改),包括一张带链接的图片--

div id=AdLayer style='position:absolute; width:61px; height:59px; z-index:20; visibility:hidden;; left: 600px; top: 300px'

a href=""img src='' border="0" height="31" width="88"/a

/div

网站漂浮广告代码怎么写?

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " " html xmlns=" " head title符合XHTML标准的漂浮广告代码(浮动广告代码)/title /headbodydiv id="ad" style="position:absolute" a href="" target="_blank"img src="a href="" border="0"/a /div script var x = y = 0; var xin = true, yin = true var step = 2; var delay = 1; var obj = document.getElementById("ad"); function floatAD(){ var L = 0; var T = (document.body.scrollTop?document.body.scrollTop:document.documentElement.scrollTop); var R = document.body.clientWidth-obj.offsetWidth; var B = T + ((document.body.clientHeight document.documentElement.clientHeight)?document.documentElement.clientHeight:document.body.clientHeight) - obj.offsetHeight; obj.style.left = x + document.body.scrollLeft; obj.style.top = y + document.body.scrollTop; x = x + step*(xin?1:-1); if (x L) { xin = true; x = L; } if (x R){ xin = false; x = R; } y = y + step * (yin?1:-1); if (y T) { yin = true; y = T; } if (y B) { yin = false; y = B; } } var itl = setInterval("floatAD()", delay); obj.onmouseover = function(){ clearInterval(itl) } obj.onmouseout = function(){ itl = setInterval("floatAD()", delay) } /script pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p pTest/ppTest/ppTest/p /body /html

悬浮广告代码,带链接的

这是左侧漂浮的广告代码

SCRIPT FOR=window EVENT=onload LANGUAGE="javascript"

initAd();//载入页面后,调用函数initAd()

/SCRIPT

script language="javascript"

!--

function initAd() {

document.all.AdLayer.style.posTop = -200;

//设置onLoad事件激发以后,广告层相对于固定后的y方向位置

document.all.AdLayer.style.visibility = 'visible'//设置层为可见

MoveLayer('AdLayer');//调用函数MoveLayer()

}

function MoveLayer(layerName) {

var x = 0;//浮动广告层固定于浏览器的x方向位置

var y = 408;//浮动广告层固定于浏览器的y方向位置

var diff = (document.body.scrollTop + y - document.all.AdLayer.style.posTop)*.90;

var y = document.body.scrollTop + y - diff;

eval("document.all." + layerName + ".style.posTop = y");

eval("document.all." + layerName + ".style.posright = x");//移动广告层

setTimeout("MoveLayer('AdLayer');", 0);//设置20毫秒后再调用函数MoveLayer()

}

//--

/script

div id=AdLayer style='position:absolute; width:61px; height:59px; z-index:20; visibility:hidden;; left: 0px; top: 100px' a href="#"img border="0" src="images/jixiangwu.gif" width="81" height="88"/a/div

固定时间显示漂浮广告代码的介绍就聊到这里吧,感谢你花时间阅读本站内容,更多关于js漂浮广告代码、固定时间显示漂浮广告代码的信息别忘了在本站进行查找喔。

版权说明:如非注明,本站文章均为 AH站长 原创,转载请注明出处和附带本文链接;

本文地址:http://ahzz.com.cn/post/19030.html


取消回复欢迎 发表评论:

分享到

温馨提示

下载成功了么?或者链接失效了?

联系我们反馈

立即下载