在asp网站上添加了一个右侧悬浮客服代码，但是添加后网页上下段之间有个间隙，位置异常，怎么调试都不行，请大家指点，谢谢

ying8536 2015-08-30 11:23:30
我在我们网站上添加了悬浮于右侧中部的客服代码，网站是asp代码制作的，该客服代码是由3个文件组成，分别是（1）ggimages文件夹，主要放置客服广告的图片;（2）ggjs文件夹，主要放置js文件,内放置一个top.js文件;（3)网站根目录下放置一个gg.asp的文件，是客服代码的主程序。

存在问题：我在index主页底部引用gg.asp文件，代码如下：

<!--#include file="gg.asp"-->
引用后，客服代码能够显示，但是在主页引用的部位出现一个巨大的间隙（客服代码的位置异常请看抓图），如果单独运行gg.asp，则正常显示，位置也在网站右侧中部，请大家帮忙指点一下是那个地方出了问题，谢谢！附代码：
-------------------------------------------------------------------------------------
（一）主页index的头代码如下:

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
<link href="css/css.css" rel="stylesheet" type="text/css">
<link href="css/css_2.css" rel="stylesheet" type="text/css">
<!--#include file="conn.asp"-->
</head>
页面底部引用gg.asp的代码如下：<div ><!--#include file="gg.asp"--> </div>
<!--#include file="end.asp" -->
-------------------------------------------------------------------------------------
（二）右侧客服悬浮窗全部代码如下：

<title>右侧漂浮窗口</title>
<!--右侧漂浮窗口头开始-->
<style type="text/css">
body{margin:0;height:1000px;}
dl,dd,dt{margin:0;padding:0;}
a{ text-decoration:none;}

.floating_ck{position:fixed;right:10px;top:30%;} /*相对位置*/
.floating_ck dl dd{position:relative;width:130px;height:100px;text-align:center;background-repeat:no-repeat;background-position:center 20%;cursor:pointer;}
.floating_ck dl dd:hover{background-color:#FF0000;border-bottom:solid 1px #FF0000;}
.floating_ck dl dd:hover .floating_left{display: block;}
.consult{background-image:url(ggimages/icon0701/zxicon.png);}
.words{background-image:url(ggimages/icon0701/tp.png);}
.quote{background-image:url(ggimages/icon0701/kficon.png);}
.qrcord{background-image:url(ggimages/icon0701/wb.png);}

.floating_ck dd span{color:#000000;display:block;padding-top:70px;}
.floating_left{position:absolute;left:-160px;top:0px;width:160px;height:100px;background-color:#FF0000;border-bottom:solid 1px #FF0000;display:none;}
.floating_left a{color:#000000;line-height:100px;}
.floating_ewm{height:200px;top:-100px;}/*调整左侧弹出窗口的高度*/
.floating_ewm i{background-image:url(ggimages/wb.png);display:block;width:145px;height:145px;margin:0;margin-top:20px;}
.floating_ewm p{color:#000000;margin-top:30px;}/*字的移动高度*/
.floating_ewm .qrcord_p01{font-size:18px;line-height:20px;}
.floating_ewm .qrcord_p02{font-size:18px;}
.STYLE1 {color: #000000}

</style>

<script type="text/javascript" src="ggjs/top.js"></script>
<!--右侧漂浮窗口头结束-->
<body>
<!--右侧漂浮窗口主体开始-->
<div class="floating_ck">
<dl>
<dt></dt>
<dd class="consult">
<span class="STYLE1"> <a href="book_write.asp " target="_blank">在线互动</a> </span>
<!-- <div class="floating_left"><a href="book_write.asp " target="_blank">我要留言</a> <a href="nzbook.asp " target="_blank">查看留言</a>
</div> -->
</dd>
<dd class="words">
<span class="STYLE1"><a href="toupiao.asp " target="_blank">在线投票</a> </span>
<!-- <div class="floating_left"><a href="#">我要投票</a></div>-->
</dd>
<dd class="quote">
<span class="STYLE1"><a href="tencent://message/?uin=1000000&Site=msn&Menu=yes #">官方QQ</a></span>

</dd>
<dd class="qrcord">
<span class="STYLE1">官方微博</span>
<div class="floating_left floating_ewm">
<i></i>


</div>
</dd>

</dl>
</div>
</body>

<!--右侧漂浮窗口主体结束-->
-------------------------------------------------------------------------------------

（三）top.js全部代码如下：
/**
JavaScript脚本实现回到页面顶部示例
@param acceleration 速度

@param stime 时间间隔 (毫秒)
**/
function gotoTop(acceleration,stime) {
acceleration = acceleration || 0.1;
stime = stime || 10;
var x1 = 0;
var y1 = 0;
var x2 = 0;
var y2 = 0;
var x3 = 0;
var y3 = 0;
if (document.documentElement) {
x1 = document.documentElement.scrollLeft || 0;
y1 = document.documentElement.scrollTop || 0;
}
if (document.body) {
x2 = document.body.scrollLeft || 0;
y2 = document.body.scrollTop || 0;
}
var x3 = window.scrollX || 0;
var y3 = window.scrollY || 0;

// 滚动条到页面顶部的水平距离
var x = Math.max(x1, Math.max(x2, x3));
// 滚动条到页面顶部的垂直距离
var y = Math.max(y1, Math.max(y2, y3));

// 滚动距离 = 目前距离 / 速度, 因为距离原来越小, 速度是大于 1 的数, 所以滚动距离会越来越小
var speeding = 1 + acceleration;
window.scrollTo(Math.floor(x / speeding), Math.floor(y / speeding));

// 如果距离不为零, 继续调用函数
if(x > 0 || y > 0) {
var run = "gotoTop(" + acceleration + ", " + stime + ")";
window.setTimeout(run, stime);
}
}
...全文
382 4 打赏 收藏 转发到动态 举报
写回复
用AI写文章
4 条回复
切换为时间正序
请发表友善的回复…
发表回复
弑虎兽 2015-09-01
  • 打赏
  • 举报
 回复
路过看看！！！！
ying8536 2015-08-31
  • 打赏
  • 举报
 回复
引用 1 楼 chinmo 的回复:
这里肯定要出问题，因为你的主页已经含有 <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/> <link href="css/css.css" rel="stylesheet" type="text/css"> 这些，还有body这些 你再<!--#include file="gg.asp"--> 进去，那就重复了这段代码，有间隙很正常的
你好版主，能明示一下吗？ 我也尝试把 gg.asp的代码直接放在index的 head 和body 之间，不通过include gg.asp的方式 ，这种情况下，仍然有间隙 啊
一把编程的菜刀 2015-08-31
  • 打赏
  • 举报
 回复
这里肯定要出问题，因为你的主页已经含有 <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/> <link href="css/css.css" rel="stylesheet" type="text/css"> 这些，还有body这些 你再<!--#include file="gg.asp"--> 进去，那就重复了这段代码，有间隙很正常的
一把编程的菜刀 2015-08-31
  • 打赏
  • 举报
 回复
那就是还有一个问题，你的浮动代码不起作用，由于兼容或者其他原因导致不起作用的，这个你要自己检查下
2017年最牛逼的分类Android项目源码免费一次性打包下载！
之前发过一个帖子，但是那个帖子有点问题我就重新发一个吧，下面的源码是我从今年开始不断整理源码区和其他网站上的安卓例子源码，目前总共有810套左右，根据实现的功能被我分成了100多个类，总共接近2.5G，还在不断...
前端基础 -- html知识汇总
HTML，即超文本标记语言（HyperText Markup Language ]），由SGML (标准通用标记语言) 发展而来，也叫web页面。...简单说：html是超文本标签语言，程序运行之后负责内容显示、负责网页上有什么显示什么。
Style笔记(css, stylus,less)
box-shadow:0px 3px 5px 7px rgb(96 98 102)　水平0 向下偏移3px 阴影的模糊度5px 阴影的范围向四周7px clear:both 当给左边栏设置float：left后他就部分脱离普通文档流了 此时侧边覆盖在底部栏的左边之上，但是我们...
2014年最新810多套源码2.46GB免费一次性打包下载
但是那个帖子有点问题我就重新发一个吧，下面的源码是我从今年3月份开始不断整理源码区和其他网站上的安卓例子源码，目前总共有810套左右，根据实现的功能被我分成了100多个类，总共接近2.5G，还在不断更新。...
HTML5+CSS3+Bootstrap开发静态页面嵌入android webview中
文章目录android开发一些体会前言一、学习知识汇总1.1、Java se基础1.2、android UI编程1.3、android网络编程与数据存储二、进阶之路(初级->中级->高级)2.2、中级工程师2.3、高级工程师三、全套功能源码 + ...
ASP

28,391

社区成员

357,059

社区内容

发帖
与我相关
我的任务
社区描述
ASP即Active Server Pages，是Microsoft公司开发的服务器端脚本环境。
社区管理员
  • ASP
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章