jquery广告,JavaScript广告

jquery 下拉广告

那你例子你下了吧?我简单改了一下做了个例子。

公司2013年成立创新互联专注于”帮助中小企业+互联网”, 也是目前成都地区具有实力的互联网服务商。团队致力于为企业提供--站式网站建设、移动端应用( H5手机营销、重庆APP软件开发、微信开发)、软件开发、信息化解决方案等服务。

你把首页里的东西放到一个div层,然后设置

style="position: absolute;z-index: 100"

然后你的下拉广告style='z-index: 999' 这样就好了,

建议你学学CSS里面的position,和z-index属性

DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""

html xmlns=""

head

meta http-equiv="Content-Type" content="text/html; charset=gbk" /

title/title

script type="text/javascript" src="jquery.js"/script

script type="text/javascript"

$(document).ready(function(){

$(".btn-slide").click(function(){

$("#panel").slideToggle("slow");

$(this).toggleClass("active"); return false;

});

});

/script

style type="text/css"

body {

margin: 0 auto;

padding: 0;

width: 570px;

font: 75%/120% Arial, Helvetica, sans-serif;

}

a:focus {

outline: none;

}

#panel {

background: #754c24;

height: 200px;

display: none;

}

.slide {

margin: 0;

padding: 0;

border-top: solid 4px #422410;

background: url(images/btn-slide.gif) no-repeat center top;

}

.btn-slide {

background: url(images/white-arrow.gif) no-repeat right -50px;

text-align: center;

width: 144px;

height: 31px;

padding: 10px 10px 0 0;

margin: 0 auto;

display: block;

font: bold 120%/100% Arial, Helvetica, sans-serif;

color: #fff;

text-decoration: none;

}

.active {

background-position: right 12px;

}

/style

/head

body

div style="position: absolute;z-index: 100"

table border='1' width="100%"

tr

td首页的东西/tdtd2/tdtd3/tdtd4/tdtd5/td

/tr

tr

td1/tdtd2/tdtd3/tdtd4/tdtd5/td

/tr

tr

td1/tdtd2/tdtd3/tdtd4/tdtd5/td

/tr

tr

td1/tdtd2/tdtd3/tdtd4/tdtd5/td

/tr

/table

/div

div id="panel" style='z-index: 999'

p style="margin: 5px;color: #fff;line-height:20px;"阿里西西/p

/div

p class="slide"a href="#" class="btn-slide"阿里西西/a/p

p阿里西西/p

/body

/html

怎么实现动态广告js或者jquery效果,给个思路也可以,有写好的插件更好了

图片轮播器之类的,具体原来就是将图片css设置成relativ,wrapper中设置为overflow为隐藏,然后更改左侧或者右侧的位置或者margin的值,上下就是更改上下的值。基本思路就是这个。

具体的演示给你个我最近找的:

怎麽用jquery制作网站首页时弹出的小广告

定义弹出层代码

div class="advbox"

div class="advpic"

img width="670" height="420" alt="" src="images/xin.jpg"/

a href="javascript:void(0);" class="closebtn"关闭/a

/div

/div

添加css样式

*{margin:0;padding:0;list-style-type:none;}

a,img{border:0;text-decoration:none;}

body{font:12px/180% Arial, Helvetica, sans-serif,"";}

/* advbox */

*html,*html body{background-image:url(about:blank);background-attachment:fixed;}

*html .advbox{position:absolute;top:expression(eval(document.documentElement.scrollTop));}

.advbox{width:670px;position:fixed;display:none;left:50%;top:0;margin:-215px 0 0 -325px;}

.advbox .advpic{position:relative;height:420px;overflow:hidden;}

.advbox .advpic .closebtn{display:block;width:40px;height:20px;line-height:20px;font-size:12px;color:#fff;text-indent:12px;overflow:hidden;position:absolute;right:5px;top:0px;z-index:99;}

加入jq代码

$(document).ready(function(){

var COOKIE_NAME = "showbox";

if($.cookie(COOKIE_NAME)){

$(".advbox").hide();

}else{

$(".advbox").show();

$(".advbox").animate({top:"50%"},1000);

$(".closebtn").click(function(){

$(".advbox").fadeOut(500);

})

$.cookie(COOKIE_NAME,'ishide',{expires:1});

}

})

jquery广告在页面自由移动特效怎么写

您好:这个可以直接百度下载一个jquery插件即可。看你的意思就是一个广告图片然后在页面上来回的动,碰到周边就改变方向那个效果吧?百度一大把。

jquery 广告,上下左右满屏移来移去,遇到窗口边缘就会相反移动(一个浮动的小广告),速求代码!

titleJS浮动广告/title 

style type="text/css" 

img{border:0;} 

/style 

SCRIPT type=text/javascript 

function addEvent(obj,evtType,func,cap){ 

cap=cap||false; 

if(obj.addEventListener){ 

obj.addEventListener(evtType,func,cap); 

return true; 

}else if(obj.attachEvent){ 

if(cap){ 

obj.setCapture(); 

return true; 

}else{ 

return obj.attachEvent("on" + evtType,func); 

}else{ 

return false; 

function getPageScroll(){ 

var xScroll,yScroll; 

if (self.pageXOffset) { 

xScroll = self.pageXOffset; 

} else if (document.documentElement  document.documentElement.scrollLeft){ 

xScroll = document.documentElement.scrollLeft; 

} else if (document.body) { 

xScroll = document.body.scrollLeft; 

if (self.pageYOffset) { 

yScroll = self.pageYOffset; 

} else if (document.documentElement  document.documentElement.scrollTop){ 

yScroll = document.documentElement.scrollTop; 

} else if (document.body) { 

yScroll = document.body.scrollTop; 

arrayPageScroll = new Array(xScroll,yScroll); 

return arrayPageScroll; 

function GetPageSize(){ 

var xScroll, yScroll; 

if (window.innerHeight  window.scrollMaxY) { 

xScroll = document.body.scrollWidth; 

yScroll = window.innerHeight + window.scrollMaxY; 

} else if (document.body.scrollHeight  document.body.offsetHeight){ 

xScroll = document.body.scrollWidth; 

yScroll = document.body.scrollHeight; 

} else { 

xScroll = document.body.offsetWidth; 

yScroll = document.body.offsetHeight; 

var windowWidth, windowHeight; 

if (self.innerHeight) { 

windowWidth = self.innerWidth; 

windowHeight = self.innerHeight; 

} else if (document.documentElement  document.documentElement.clientHeight) { 

windowWidth = document.documentElement.clientWidth; 

windowHeight = document.documentElement.clientHeight; 

} else if (document.body) { 

windowWidth = document.body.clientWidth; 

windowHeight = document.body.clientHeight; 

if(yScroll  windowHeight){ 

pageHeight = windowHeight; 

} else { 

pageHeight = yScroll; 

if(xScroll  windowWidth){ 

pageWidth = windowWidth; 

} else { 

pageWidth = xScroll; 

arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight) 

return arrayPageSize; 

var AdMoveConfig=new Object(); 

AdMoveConfig.IsInitialized=false; 

AdMoveConfig.ScrollX=0; 

AdMoveConfig.ScrollY=0; 

AdMoveConfig.MoveWidth=0; 

AdMoveConfig.MoveHeight=0; 

AdMoveConfig.Resize=function(){ 

var winsize=GetPageSize(); 

AdMoveConfig.MoveWidth=winsize[2]; 

AdMoveConfig.MoveHeight=winsize[3]; 

AdMoveConfig.Scroll(); 

AdMoveConfig.Scroll=function(){ 

var winscroll=getPageScroll(); 

AdMoveConfig.ScrollX=winscroll[0]; 

AdMoveConfig.ScrollY=winscroll[1]; 

addEvent(window,"resize",AdMoveConfig.Resize); 

addEvent(window,"scroll",AdMoveConfig.Scroll); 

function AdMove(id){ 

if(!AdMoveConfig.IsInitialized){ 

AdMoveConfig.Resize(); 

AdMoveConfig.IsInitialized=true; 

var obj=document.getElementById(id); 

obj.style.position="absolute"; 

var W=AdMoveConfig.MoveWidth-obj.offsetWidth; 

var H=AdMoveConfig.MoveHeight-obj.offsetHeight; 

var x = W*Math.random(),y = H*Math.random(); 

var rad=(Math.random()+1)*Math.PI/6; 

var kx=Math.sin(rad),ky=Math.cos(rad); 

var dirx = (Math.random()0.5?1:-1), diry = (Math.random()0.5?1:-1); 

var step = 1; 

var interval; 

this.SetLocation=function(vx,vy){x=vx;y=vy;} 

this.SetDirection=function(vx,vy){dirx=vx;diry=vy;} 

obj.CustomMethod=function(){ 

obj.style.left = (x + AdMoveConfig.ScrollX) + "px"; 

obj.style.top = (y + AdMoveConfig.ScrollY) + "px"; 

rad=(Math.random()+1)*Math.PI/6; 

W=AdMoveConfig.MoveWidth-obj.offsetWidth; 

H=AdMoveConfig.MoveHeight-obj.offsetHeight; 

x = x + step*kx*dirx; 

if (x  0){dirx = 1;x = 0;kx=Math.sin(rad);ky=Math.cos(rad);} 

if (x  W){dirx = -1;x = W;kx=Math.sin(rad);ky=Math.cos(rad);} 

y = y + step*ky*diry; 

if (y  0){diry = 1;y = 0;kx=Math.sin(rad);ky=Math.cos(rad);} 

if (y  H){diry = -1;y = H;kx=Math.sin(rad);ky=Math.cos(rad);} 

this.Run=function(){ 

var delay = 10; 

interval=setInterval(obj.CustomMethod,delay); 

obj.onmouseover=function(){clearInterval(interval);} 

obj.onmouseout=function(){interval=setInterval(obj.CustomMethod, delay);} 

/SCRIPT 

DIV id=ad1 style="Z-INDEX: 5" 

!--漂浮开始-- 

A href="" 

target=_blankIMG src=""/A 

!--漂浮结束-- 

/DIV 

SCRIPT type=text/javascript!-- 

var ad1=new AdMove("ad1"); 

ad1.Run(); 

//多组漂浮 

//var ad1=new AdMove("ad2"); 

//ad2.Run(); 

//-- 

/SCRIPT


文章名称:jquery广告,JavaScript广告
网址分享:http://hbruida.cn/article/hoegcj.html