固定时间显示漂浮广告代码(js漂浮广告代码)
admin 发布:2022-12-19 18:59 158
今天给各位分享固定时间显示漂浮广告代码的知识,其中也会对js漂浮广告代码进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在开始吧!
本文目录一览:
- 1、JS漂浮广告代码
- 2、页面悬浮广告代码
- 3、网站漂浮广告代码怎么写?
- 4、悬浮广告代码,带链接的
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站长 原创,转载请注明出处和附带本文链接;
相关推荐
- 05-18百度广告推广电话,不需要验证码的广告平台
- 05-17广告软文营销平台,广告软文营销平台怎么做
- 05-16湖北最新消息,消费券发放时间2024年湖北最新消息
- 05-16关键词竞价广告,关键词竞价广告的缺点
- 05-15在百度上打广告找谁,百度上打广告有效果吗
- 05-14广告网,广告网站留电话
- 05-10打广告的平台,打广告的平台有哪些
- 05-09网页代码,网页代码快捷键
- 05-08广告软文外链平台,广告软文外链平台有哪些
- 05-07什么平台可以免费发广告,哪些平台可以免费发广告
取消回复欢迎 你 发表评论:
- 标签列表
- 最近发表
- 友情链接