修改一下JQUERY的引用位置，就可以使用了。
<!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>
<title>浮动广告</title>
<style type="text/css">
#qqonline1{
background-color:#fff;
border: 1px solid #ccc;
position:absolute;
top:100px;
right:16px;
width:100px;
padding:10px 20px;
}
</style>
<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(this).scroll(function() {
// 页面发生scroll事件时触发
var bodyTop = 0;
if (typeof window.pageYOffset != 'undefined') {
bodyTop = window.pageYOffset;
}
else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat')
{
bodyTop = document.documentElement.scrollTop;
}
else if (typeof document.body != 'undefined') {
bodyTop = document.body.scrollTop;
}
$("#qqonline1").css("top", 100 + bodyTop)
});
function jump(id)
{
$(id).scrollTop(0);
return false;
}
</script>
</head>
<body><!-- 给BODY加个样式，让页面出现滚动条 -->
<div id="arc1" style="height:1000px;">
<h3>arc1</h3>
</div>
<form id="form1" runat="server">
</form>
<div id="arc2" style="height:1000px;">
<h3>arc2</h3>
</div>
<div id="arc3" style="height:1000px;">
<h3>arc3</h3>
</div>
<div id="qqonline1">
<a href="#arc1">ARTICLE1</a>
<a href="#arc2">ARTICLE2</a>
<a href="#arc3">ARTICLE3</a>
</div>
</body>
</html>
分享到：
相关推荐
标题中的“jquery浮动层，跳转到页面指定链接”指的是使用jQuery库来创建一个浮动的层（通常称为弹出窗口或对话框），该层能够帮助用户实现页面内部或外部的链接跳转。jQuery是一个强大的JavaScript库，它简化了HTML...
在这个“Jquery浮动窗与页面定时跳转”的主题中，我们将深入探讨如何在ASP.NET环境中利用jQuery来创建浮动窗口，并在其中实现定时跳转功能，同时也会涉及在框架外的页面定时跳转。 首先，让我们理解jQuery浮动窗口...
锚点链接（#anchor）允许用户通过点击链接快速跳转到页面上的特定位置。在jQuery中，你可以监听锚点链接的点击事件，然后使用`$("html, body").animate()`方法平滑滚动到对应的锚点位置，而不是立即跳转。 示例...
"弹出登录框的JQuery弹出浮动层"就是一种常见的交互设计手法，它允许用户在不离开当前页面的情况下进行登录操作，提高了用户体验。JQuery，一个强大的JavaScript库，使得实现这样的功能变得更加简单。接下来，我们将...
"jquery浮动固定层导航条点击页面滚动到设置的描点位置"是一个常见的功能，它涉及到jQuery库的使用以及HTML锚点定位技术。下面将详细解释这个知识点。 首先，jQuery是一个轻量级的JavaScript库，它简化了JavaScript...
3. **图片广告**：图片广告是网络广告的一种常见形式，通常包含一个图像链接，当用户点击时会跳转到相应的广告页面。在jQuery浮动图片广告代码中，广告图片不仅可以动态显示，还可以根据用户行为进行互动，比如鼠标...
"用于弹出登录框的JQuery弹出浮动层"是一个常见的技术需求，尤其对于那些希望在不跳转页面的情况下提供登录功能的网站。JQuery，一个强大的JavaScript库，提供了丰富的功能来实现这样的效果。 首先，我们要理解...
4. **jQuery代码实现**：在页面加载完成后，我们需要使用jQuery监听滚动事件，当用户滚动到特定位置时，改变导航链接的样式以显示预览效果。这里可以使用`$(window).scroll()`函数，然后通过`scrollTop()`方法获取...
总结一下，创建jQuery浮动图片广告主要涉及以下步骤： 1. 引入jQuery库。 2. 设计HTML结构，包含广告图片。 3. 使用jQuery设置广告元素的初始位置和浮动效果。 4. 添加点击事件，实现广告链接的跳转。 5. 可选：添加...
弹出层通常指的是在用户与页面交互时，如点击按钮或链接，会在当前页面上弹出一个浮动窗口，显示额外的信息或功能。这种效果可以用来展示详细信息、表单、图片等，而不会完全离开当前页面。 实现jQuery点击链接弹出...
在jQuery中，我们可以监听滚动事件，当页面滚动到特定位置时，激活对应的浮动菜单项，使其高亮显示，以指示当前可视区域的内容。 实现这个功能的步骤如下： 1. **HTML结构**：创建浮动菜单栏，包含页面主要部分的...
《全面解析：jQuery实现的购物网站页面》 在网页开发领域，jQuery是一个广泛使用的JavaScript库，它极大地简化了DOM操作、事件处理、动画效果以及Ajax交互。本实例代码——"完整jquery实现的购物网站页面"，是针对...
【jQuery页面滚动浮动导航切换效果源码】 在网页设计中，导航栏是用户与网站交互的重要部分，它帮助用户在各个页面间轻松跳转。jQuery页面滚动浮动导航切换效果是一种常见的增强用户体验的设计手法，它使得导航菜单...
4、自定义浮动提示，模拟title的tip提示显示，右上角固定位置的操作提示层(ajax请求中提示，页面跳转中提示等)。 5、自定义容器装载外部图片，无柔化投影。 6、鼠标跟随效果，智能垂直方向、水平方向跟随。 烈火...
5. 链接跳转或Ajax交互：根据设计，点击客服图标后，可能是直接跳转到一个带有QQ聊天窗口的新页面，或者使用Ajax异步技术与服务器通信，获取并显示聊天窗口。对于后者，需要使用jQuery的`.ajax()`方法发送请求，并...
这种特效不仅能够吸引用户的注意力，还能方便他们通过扫描二维码直接跳转到特定的链接或者下载应用。 首先，我们需要理解jQuery库的基本概念。jQuery是一个高效、简洁的JavaScript库，它简化了HTML文档遍历、事件...
开发者需要注册获取QQ的API密钥，并在网页中嵌入相应的代码，以实现点击客服菜单后弹出QQ聊天窗口或者跳转到指定的QQ号码页面。这一步可能涉及到AJAX请求，以实现无刷新的交互，同时也需要处理跨域通信的问题。 ...
在“jquery图片对联广告制作jQuery侧面浮动图片广告”这个主题中，我们将深入探讨如何利用jQuery来创建具有吸引力的、动态显示的图片广告，特别是侧边栏的浮动广告。 首先，我们要理解什么是“图片对联广告”。这种...
jQuery轮播图带浮动焦点是这种效果的一种增强，它不仅提供了自动切换的图片展示，还允许用户通过浮动焦点（通常是小点或箭头）来手动控制轮播的进度。这种交互方式提升了用户体验，使得用户可以更自由地浏览和探索...