地面固定车位锚点

来源：蜘蛛抓取(WebSpider) 时间：2016-06-08 20:40 标签： 槽钢钢架地面固定图
jQuery侧边栏固定层锚点定位代码
相关最新源码
jQuery侧边栏固定层锚点定位代码基于jquery-1.7.1.min.js制作，页面滚动一段距离出现固定层菜单栏，有劲爆商品、最新特卖、最后疯抢、即将开始、回到首部等菜单导航栏目。
&&&&&&&&&&&&&&&&&&&&&&&&&
源码下载地址君，已阅读到文档的结尾了呢~~
第一节锚点的种类及安全技术要..
扫扫二维码，随身浏览文档
手机或平板扫扫即可继续访问
第一节锚点的种类及安全技术要求一、锚点的种类
举报该文档为侵权文档。
举报该文档含有违规或不良信息。
反馈该文档无法正常浏览。
举报该文档为重复文档。
推荐理由：
将文档分享至：
分享完整地址
文档地址：
粘贴到BBS或博客
flash地址：
支持嵌入FLASH地址的网站使用
html代码：
&embed src='/DocinViewer-4.swf' width='100%' height='600' type=application/x-shockwave-flash ALLOWFULLSCREEN='true' ALLOWSCRIPTACCESS='always'&&/embed&
450px*300px480px*400px650px*490px
支持嵌入HTML代码的网站使用
您的内容已经提交成功
您所提交的内容需要审核后才能发布，请您等待！
3秒自动关闭窗口解决使用固定导航时锚点偏移问题
您当前位置： &
[ 所属分类
| 时间 2015 |
作者 红领巾 ]
最近Bootstrap修改了博客主题，使其支持响应式布局，并且将导航菜单固定住，不随滚到条滚动，这样做带来的影响是Categories和Tags页面点击某一个分类或者标签链接时， 锚点定位必然定位于页面顶部，这样一来就会被固定住的导航遮挡 ，例如，我在Categories页面，点击hbase分类，锚点定位最后如下图：
网上查找了一些资料，找到一篇文章 点击锚点让定位偏移顶部 ，这篇文章提到几种解决办法：
第一种，使用css将锚点偏移：
&a class="target-fix" &&/a&
&artivle&主体内容...&/article&
.target-fix {
top: -44 /*偏移值*/
height: 0;
对于现代浏览器如果支持css的 :target 声明，可以这么设置：
article.a-post:target{
padding-top:44
第二种，使用去调整scroll值：
$(function(){
if(location.hash){
var target = $(location.hash);
if(target.length==1){
var top = target.offset().top-44;
if(top & 0){
$('html,body').animate({scrollTop:top}, 1000);
注意：上面代码中的44为固定的导航所占的像素高度，根据你的实际情况做修改。
当然，你也可以使用jquery-hashchange插件去实现上面的功能，但是需要注意jquery-hashchange是否支持你使用的JQuery版本。
$(function(){
/* 绑定事件*/
$(window).hashchange(function(){
var target = $(location.hash);
if(target.length==1){
var top = target.offset().top-44;
if(top & 0){
$('html,body').animate({scrollTop:top}, 1000);
/* 触发事件 */
$(window).hashchange();
分析上面两种方法，我最后使用的是第二种方法，在core.js文件中添加如下代码：
$('a[href^=#][href!=#]').click(function() {
var target = document.getElementById(this.hash.slice(1));
if (!target)
var targetOffset = $(target).offset().top-70;
$('html,body').animate({scrollTop: targetOffset}, 400);
这里，我是在链接上监听单击事件，获取目标对象的偏移，上面减去70是因为下面的css代码：
min-height: 100%;
margin: 0 auto -60
padding: 70px 0 60
刷新页面，再次点击目录或者标签，就可以正常的跳到锚点位置了。你可以点击分类hbase 试试效果。
但是，还没有结束。如果是从其他页面，例如，在文章页面点击分类或标签时，页面却不会跳转到正确的锚点位置。这是因为上面的javascript代码只是考虑了当前页面，是在当前页面获取目标的偏离，而没有考虑在另外一个页面单击链接跳到目标页面的锚点的情况。
所以，我们需要修改代码：
var handler=function(hash){
var target = document.getElementById(hash.slice(1));
if (!target)
var targetOffset = $(target).offset().top-70;
$('html,body').animate({scrollTop: targetOffset}, 400);
$('a[href^=#][href!=#]').click(function(){
handler(this.hash)
if(location.hash){ handler(location.hash) }
这样，就大功告成了，希望这篇文章对你有所帮助。
本文前端（javascript）相关术语:javascript是什么意思 javascript下载 javascript权威指南 javascript基础教程 javascript 正则表达式 javascript设计模式 javascript高级程序设计 精通javascript javascript教程
转载请注明本文标题：本站链接：
分享请点击：
1.凡CodeSecTeam转载的文章,均出自其它媒体或其他官网介绍,目的在于传递更多的信息,并不代表本站赞同其观点和其真实性负责；
2.转载的文章仅代表原创作者观点,与本站无关。其原创性以及文中陈述文字和内容未经本站证实,本站对该文以及其中全部或者部分内容、文字的真实性、完整性、及时性，不作出任何保证或承若；
3.如本站转载稿涉及版权等问题,请作者及时联系本站,我们会及时处理。
登录后可拥有收藏文章、关注作者等权限...
阅读(1543)
既然降生到这世上，我就要好好看看它，找到属于自己的世界第一。
手机客户端
，专注代码审计及安全周边编程，转载请注明出处：http://www.codesec.net
转载文章如有侵权，请邮件 admin[at]codesec.net当前位置： >
jQuery右侧固定层导航锚点定位代码
时间： 15:43 来源： 作者： 浏览：
由源码搜藏网整理,转载请注明出处
源码搜藏承诺：本站所有资源无病毒，无弹窗，无干扰链接！
你可能感兴趣的内容

我要回帖

更多关于 槽钢钢架地面固定图 的文章

 

随机推荐