锚点、绝对定位---回到顶部

 <html>
<head>
  <meta charset="utf-8">
  <title>锚点、绝对定位---回到顶部</title>
<style>
/*position:fixed;绝对定位*/
#image2{
margin-left:90%;
margin-top:35%;
position:fixed;
}
/* 只是纯粹的设置背景图片位置而已
body{
    background-image:url(./111.jpg);
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-position:100% 50%;
}
*/
</style>
</head>
<body>
<a name="top">顶部</a>

<div id="image2">
    <a href="#top">
        <img src="./111.jpg" alt="111"/>
    </a>
</div>

<table width="100px" height="500px" border="1" cellspacing="0" cellpadding="5px">
    <tr><td>111</td></tr>
</table>
<hr/>
<table width="100px" height="500px" border="1" cellspacing="0" cellpadding="5px">
    <tr><td>222</td></tr>
</table>
</body>
</html>
时间: 2024-11-06 07:11:05

锚点、绝对定位---回到顶部的相关文章

一个回到顶部的锚点

一般网站的右下角都会有一个回到顶部的锚点,但是在没有学bootstrap的时候,我还是会想着用定位来做这个东西,但是现在用bootstrap来做的,所以将它记录下来. <!DOCTYPE html> <html> <head> <title>附加导航插件</title> <meta charset = 'utf-8'> <link rel = 'stylesheet' href = 'http://files.cnblogs.c

js使用锚点回到顶部

使用锚点链接是一种简单的返回顶部的功能实现.该实现主要在页面顶部放置一个指定名称的锚点链接,然后在页面下方放置一个返回到该锚点的链接,用户点击该链接即可返回到该锚点所在的顶部位置 <body style="height:2000px;"> <div id="topAnchor"></div> <a href="#topAnchor" style="position:fixed;right:0;b

ASP.NET - 锚点跳转,用于回到顶部

<a name ="top"></a> <a href ="#top">回到顶部</a> 第一行代码写在顶部,第二行代码写在底部.

回到顶部-锚点

<!DOCTYPE html> <html> <head> <style> * { margin: 0; padding: 0; } .content { width: 100%; height: 2000px; background-color: gray; } .dw { position: fixed; width: 100px; height: 100px; color: #fff; right: 50px; bottom: 100px; backg

转:5种回到顶部的写法从实现到增强

http://www.cnblogs.com/xiaohuochai/p/5836179.html 前面的话 本文先详细介绍回到顶部的5种写法,然后对其实现功能增加,最后得到最终实现 写法 [1]锚点 使用锚点链接是一种简单的返回顶部的功能实现.该实现主要在页面顶部放置一个指定名称的锚点链接,然后在页面下方放置一个返回到该锚点的链接,用户点击该链接即可返回到该锚点所在的顶部位置 [注意]关于锚点的详细信息移步至此 <body style="height:2000px;">

浮动【电梯】或【回到顶部】小插件:iElevator.js

iElevator.js 是一个jquery小插件,使用简单,兼容IE6,支持UMD和3种配置方式,比锚点更灵活. Default Options _defaults = { floors: null, btns: null, backtop: null, selected: '', sticky: -1, visible: { isHide: 'no', numShow: 0 }, speed: 400, show: function(me) { me.element.show(); }, h

回到顶部的写法

[1]锚点 使用锚点链接是一种简单的返回顶部的功能实现.该实现主要在页面顶部放置一个指定名称的锚点链接,然后在页面下方放置一个返回到该锚点的链接,用户点击该链接即可返回到该锚点所在的顶部位置 <body style="height:2000px;"> <div id="topAnchor"></div> <a href="#topAnchor" style="position:fixed;rig

5种回到顶部的写法从实现到增强

× 目录 [1]写法 [2]增强 [3]实现 前面的话 本文先详细介绍回到顶部的5种写法,然后对其实现功能增加,最后得到最终实现 写法 [1]锚点 使用锚点链接是一种简单的返回顶部的功能实现.该实现主要在页面顶部放置一个指定名称的锚点链接,然后在页面下方放置一个返回到该锚点的链接,用户点击该链接即可返回到该锚点所在的顶部位置 [注意]关于锚点的详细信息移步至此 <body style="height:2000px;"> <div id="topAnchor&

【JQ+锚标记实现点击页面回到顶部】

前言:今天想写个页面常用到的[点击回到页面顶部或是首页的功能],生活和职场一样,总会有低谷的时候,这个时候咱也别怂.别怂.别怂,说三遍!那都不是事,工作没了,再找呗,就像我上周五,团队解散那天,我是笑着走的,还给小白挥了挥手,微笑一个.那句话叫什么来着,佛祖虽给你关了一扇门,说不定会再给你开一扇窗.明天我就换工作了,我感谢我的同学. a)下面看看实现,实现很简单,通过JQ判断滚动条向下滚动的长度大于多少时显示[回到顶部+回到首页]的图标(换一种理解:滚动条顶端距离页面顶部的距离),另外一种实现方