<!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实现的对联广告功能，旨在帮助开发者快速、便捷地在网站上添加这种常见的广告形式。 对联广告，通常是指在网页两侧或者页面顶部、底部呈现的...
在JavaScript（简称JS）编程中，实现对联广告功能是一项常见的任务，特别是在网页设计和开发中。对联广告，通常是指出现在网页两侧，形似传统对联的横幅广告。这种广告形式既能够吸引用户的注意力，又不会过度干扰...
js对联广告代码演示 javascript对联
网站对联广告 js
对联广告通常指的是那些在网页两侧呈现的、形状类似对联的广告形式，它们可以是图片、文本或者动态内容。这种广告形式因其独特的布局和吸引眼球的设计而受到广告商的青睐。在JavaScript中实现对联广告，我们可以从...
首先，"弹性滚动对联广告代码"是一种使用JavaScript（JS）编写的脚本，它实现了广告条目在页面滚动时动态调整位置的功能。JavaScript是一种轻量级的解释型编程语言，常用于网页交互和动态效果的实现。通过JS，我们...
在本教程中，我们将深入探讨如何使用JavaScript（JS）来实现对联广告的动态加载和交互。 首先，`default.htm`是网页的主文件，它包含了HTML结构和JavaScript代码。在HTML中，你需要创建两个div元素，分别代表对联...
"带关闭的js对联广告代码"是指一种特殊的JavaScript实现，它用于创建具有关闭功能的对联广告，这种广告通常出现在网页的两侧，以横幅的形式展示，并且用户可以方便地点击关闭按钮来移除广告。 对联广告，又称为对联...
综合以上信息，我们可以得出，"标准对联广告Js代码"是一个可能包含完整功能的JavaScript实现，用于创建网页上的对联广告。它提供了广告加载、尺寸适配、交互性、动画效果和错误处理等功能，对于网页开发者来说，是一...
根据提供的标题、描述以及部分代码内容，我们可以总结出以下关于“对联广告JS代码效果”的相关知识点： ### 对联广告JS代码概述 对联广告通常指的是网页两侧展示的竖向广告，这类广告形式在国内网站中较为常见。...
`tan.js`很可能是主要的JavaScript源代码文件，它包含了实现对联广告逻辑的函数、变量和事件处理程序。这个文件可能包括了广告的加载、显示、点击跟踪、广告切换等功能。 1. **广告加载**：JavaScript可以用来异步...
【标题】"jQuery图片对联广告制作jQuery侧面浮动图片广告"涉及到的是网页开发中的广告设计与实现技术，主要使用了JavaScript库jQuery来实现动态、交互式的广告效果。在这个项目中，开发者通过jQuery创建了一个侧边栏...
网页对联广告是一种常见的网页设计元素，通常出现在网站的两侧，形状类似传统的对联，用于展示动态滚动的图片或文字信息。这种效果可以吸引用户的注意力，增加广告的可见度，从而提升网站的互动性和用户体验。在本...
自定义JS对联广告代码,简单，容易操作，也可以自己随心修改
对联广告可以是图片、文字或者动态效果，通常以HTML和CSS进行布局，JavaScript负责交互功能。设计师会考虑到用户体验，确保广告的尺寸适中，不会影响到用户浏览主要内容。 再来说说“图片广告”。图片广告是最常见...
【标题】"可关闭 js 对联广告代码(图片非flash)" 涉及的是前端开发中的广告展示技术，特别是利用JavaScript实现的一种用户可选择关闭的对联广告代码。这种广告通常出现在网页两侧，形似对联，且不依赖Flash技术，...
在本文中，我们将深入探讨如何使用原生JS创建一个可展开和关闭的固定图片对联广告代码，这种广告通常出现在页面两侧，提供吸引用户注意力的视觉元素。 首先，我们需要理解HTML结构。一个简单的图片对联广告可能包含...
左右两侧对联广告特效，js文件......
Js对联广告代码! 值得下载看看!资源免费,大家分享!! 更多免费资源 http://ynsky.download.csdn.net/
js 实现 对联广告! 值得下载看看!资源免费,大家分享!!