<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>对联广告Js代码</title>
<script type='text/javascript' src='jquery-1.4.2.min.js'></script>
<style type="text/css">
<!--
#lovexin12,#lovexin14{
width:90px;
height:230px;
background-color:#ededed;
border:1px solid #ddd;
}
html,body{
height:1203px;
}
#mm{
height:1000px;
}
-->
</style>
<!--对联广告js-->
<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*/}
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;
}
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>
<!--查看图片Js-->
<script>
function fnCreate(src){
/* 要创建的div的classname */
var ClassName = "thumbviewbox";
if(src == '')
{
return false;
}
/* 优先创建图片,如果图片没有加载成功,回调自己 */
var img = document.createElement('img');
img.setAttribute('src',src);
var imgwd = img.width;
var imghg = img.height;
if(imgwd<1)
{
var timer = setTimeout("fnCreate('"+src+"')",100);
return false;
}else{
clearInterval(timer);
}
/* 清除已经弹出的窗口,防止冒泡 */
em = document.getElementsByClassName(ClassName)
for(var i=em.length-1; i>=0; i--){
var p = em[i];
p.parentNode.removeChild(p);
}
/* 各项参数 */
var htmlWidth = window.innerWidth; //可见区域宽度
var htmlHeight = window.innerHeight; //可见区域高度
var divleft = 0; //将要创建的div的左边距
var divtop =0; //将要创建的div的右边距
var closefunction = 'em=document.getElementsByClassName("'+ClassName+'");for(var i=em.length-1;i>=0;i--){var p=em[i];p.parentNode.removeChild(p);}'; //关闭div的代码
img.setAttribute('onclick',closefunction);
/* 计算通过图片计算div应该在的位置,保证弹窗在页面中央 */
if(imgwd>htmlWidth*0.8)
{
img.setAttribute('width',htmlWidth*0.8);
divleft=htmlWidth*0.1;
if(imghg>htmlHeight*0.8)
{
divtop = htmlHeight*0.1;
}else{
divtop = (htmlHeight-imghg)/2;
}
}else{
img.setAttribute('width',imgwd);
divleft= (htmlWidth-imgwd)/2;
if(imghg>htmlHeight*0.8)
{
divtop = htmlHeight*0.1;
}
else
{
divtop = (htmlHeight-imghg)/2;
}
}
/* 创建关闭按钮 */
var closebtn = document.createElement('a');
closebtn.setAttribute('class','close');
closebtn.setAttribute('href','javascript:;');
closebtn.setAttribute('style','position:absolute;top:-20px;right:-5px;cursor:pointer;background:#444;color:#FFF;');
closebtn.innerHTML = '[close/关闭]';
closebtn.setAttribute('onclick',closefunction);
/* 创建弹窗 */
var element = document.createElement('div');
element.appendChild(img);
element.appendChild(closebtn);
element.setAttribute('class',ClassName);
element.setAttribute('style','border:5px solid #444;position:absolute;top:'+Math.round(divtop)+'px;left:'+Math.round(divleft)+'px;border-radius:5px;background:#FFF');
document.body.appendChild(element);
}
</script>
<!--展开隐藏效果JS-->
<script type="text/javascript">
$(document).ready(function(){
$('#show').toggle(
function(){
$('#dataTable tr:gt(1)').hide();
//$('#key2').hide();这里有分页的话可以隐藏
$(this).text('展开');
},
function(){
$('#dataTable tr:gt(1)').show();
//$('#key2').show();这里有分页的话可以显示
$(this).text('关闭');
}
);
});
</script>
</head>
<body>
<div id="mm">
<center> <a href="#" onclick="fnCreate('weight_info!draw.action.png')"> <img src="weight_info!draw.action.png" width="60px" height="120px"/></a></center>
<center> <table width="60%" border="0" cellpadding="0" cellspacing="1" bgcolor="#CFD8C5" id="dataTable">
<tr>
<td colspan="4" bgcolor="#FFF">
<span style="float:right; font-size:14px; font-weight:bold; padding-right:10px;">
<a href="#" id="show"> 关闭 </a>
</span>
<strong>销售单</strong>
</td>
</tr>
<tr id="divc">
<td align="center" bgcolor="#E1F0AF">产品名称</td>
<td width="20%" align="center" bgcolor="#E1F0AF">数量</td>
<td width="20%" align="center" bgcolor="#E1F0AF">购买金额</td>
<td width="20%" align="center" bgcolor="#E1F0AF">使用积分</td>
</tr>
<tr>
<td align="center" bgcolor="#FFFFFF">大闸蟹</td>
<td align="center" bgcolor="#FFFFFF">1</td>
<td align="center" bgcolor="#FFFFFF">100</td>
<td align="center" bgcolor="#FFFFFF">0</td>
</tr>
<tr>
<td align="center" bgcolor="#FFFFFF">大闸蟹</td>
<td align="center" bgcolor="#FFFFFF">1</td>
<td align="center" bgcolor="#FFFFFF">100</td>
<td align="center" bgcolor="#FFFFFF">0</td>
</tr>
</table>
<center>
</div>
</body>
</html>
分享到:
相关推荐
js对联广告代码演示 javascript对联
js实现对联广告功能 真正实现对联广告功能
网站对联广告 js
js实现的对联广告,使用起来很方便,不用再自己写,直接用就可以。
Javascript例子对联广告
带关闭的js对联广告代码 带关闭的js对联广告代码
自定义JS对联广告代码,简单,容易操作,也可以自己随心修改
左右两侧对联广告特效,js文件......
很炫,兼容性超好的滚动对联广告代码 经典的对联广告代码,JS代码实现,很简洁,也是通用的代码,随着滚动条的滚动自动适应,对联大小由CSS控制,这使得代码修改起来更加方便快捷,不懂JS也没有关系。
网页图片对联广告代码
原生js广告代码制作可展开关闭的页面上固定的图片对联广告代码
Js对联广告代码! 值得下载看看!资源免费,大家分享!! 更多免费资源 http://ynsky.download.csdn.net/
js 实现 对联广告! 值得下载看看!资源免费,大家分享!!
对联广告的javascript源码,解压即可使用
JS常用脚本+html代码大全+对联广告代码效果大全
js 实现 带关闭的对联广告! 值得下载看看!资源免费,大家分享!!
JS广告代码 漂浮 对联 JS广告代码 漂浮 对联
对联滚动图片效果、JAVASCRIPT编写。直接嵌套在HTML中可用
可关闭 js 对联广告代码(图片非flash).zip