<script type="text/javascript">
              
                     $(window).scroll(function() {
                         var thisscroll = $(window).scrollTop();
                        if( thisscroll>= 500 ){
                            $(".xiangxix").addClass("fixedxiangxix");
                            $(".xiangxix").addClass("container");
                         }else{
                              $(".xiangxix").removeClass("fixedxiangxix");
                            $(".xiangxix").removeClass("container");
                         }
                         var list1 = $("#sjwz").offset().top - 40;
                         var list2 = $("#gmxz").offset().top - 40;
                         var list3 = $("#bdxq").offset().top - 40;
                         var list4 = $("#xfpj").offset().top - 40;
                         if(thisscroll < list2){
                             $(".xiangxix ul li").removeClass("xxfangwen");
                             $(".xiangxix ul li:eq(0)").addClass('xxfangwen');
                         }
                         if(thisscroll >= list2 && thisscroll < list3){
                             $(".xiangxix ul li").removeClass("xxfangwen");
                             $(".xiangxix ul li:eq(1)").addClass('xxfangwen');
                         }
                        
                          if(thisscroll >= list3 && thisscroll < list4){
                             $(".xiangxix ul li").removeClass("xxfangwen");
                             $(".xiangxix ul li:eq(2)").addClass('xxfangwen');
                         }
                          if(thisscroll >= list4){
                             $(".xiangxix ul li").removeClass("xxfangwen");
                             $(".xiangxix ul li:eq(4)").addClass('xxfangwen');
                         }
                     })
                     $(".xiangxix ul li.item a").click(function(){            
                         if(!$('html,body').is(":animated")){
                             var thisscrll = $($(this).attr("href")).offset().top - 40;
                            $('html,body').animate({scrollTop:thisscrll+'px'}, 300);
                            //$(".xiangxix ul li").removeClass('xxfangwen');
                            //$(this).parents("li").addClass('xxfangwen');
                         }
                     return false;
                     })
            
            </script>

获取元素高度及定位js的更多相关文章

  1. js if for 详解 获取元素方式 及一些js 基础知识

    ##获取元素的新方法## --document.querySelector('Css Selector{css选择器}') 接收一个css选择器(通配,群组,类,包含,id....等) 若这个选择器对 ...

  2. vue 获取元素高度

    1.html <div ref="getheight"></div> <br><br> 2.JavaScript // 获取高度值 ...

  3. Jquery获取元素高度

    第一步, 获取你要得到高度的那个div的jQuery对象, 获得方法有很多很多种, 具体你可以看一下jQuery API文档里的选择器部分, 在这里我只跟你说一个最直接的方法, 通过id获得: $(& ...

  4. uniapp 获取元素高度 距离顶部高度等

    let _this=this let height="" const query = uni.createSelectorQuery() query.select('#u-drop ...

  5. 【jquery】获取元素高度

    1. $("#div_id").height(); // 获得的是该div本身的高度, (不包含padding,margin,border)2. $("#div_id&q ...

  6. JS获取元素CSS值的各种方法分析

    先来看一个实例:如何获取一个没有设置大小的字体? <!DOCTYPE html> <html lang="en"> <head> <met ...

  7. Vue 获取元素样式 元素高度

    看到这个问题我第一时间想的竟然是JS 不知道你是怎么想的 不过昨天有一个小哥哥 问我一个Vue的 哈哈哈 get了 我当时问他为什么不用JS获取 他说 这个性能更高 那我们来看看这个高性能的获取元素高 ...

  8. 「jQuery」获取元素的高度

    在jQuery中,获取元素高度的方法有3个:height().innerHeight().outerHeight(); 顺带记一下元素的盒模型: height(高度), padding(内边距), m ...

  9. JS获取div高度的方法

    有时在写页面时,需要获取一个div的高度.怎么才能获取呢?哈哈,先上结论.有两种方法. offsetHeight .clientHeight getComputedStyle offsetHeight ...

随机推荐

  1. [转]jQuery Pagination Ajax分页插件中文详解

    在做项目时需要用到在前端页面中需要实现分页显示的功能,类似于博客园下面的分页导航.从网上找了几个,觉得下面这个使用起来非常简单,也很方便.特在这里记录一下. 以下为文章原文. 中文项目地址:http: ...

  2. C-union的使用

    union有两个作用: 1,节约空间,如果一个struct存在两个互斥的变量,则可以把这个struct变成union 2,将同一个内存作为多种解释 代码: #include <iostream& ...

  3. wp8.1 Study10:APP数据存储

    一.理论 1.App的各种数据在WP哪里的? 下图很好介绍了这个问题.有InstalltionFolder, knownFolder, SD Card... 2.一个App的数据存储概览 主要分两大部 ...

  4. Visual Studio 中的头文件、源文件和资源文件都是什么?有什么区别??

    头文件:后缀为.h,主要是定义和声明之类的,比如类的定义,常量定义源文件:后缀.cpp,主要是实现之类的,比如类方法的实现资源文件主要是你用到的一些程序代码以外的东西,比如图片之类,或者菜单.工具栏之 ...

  5. Iterator和ListIterator的区别

    Iterator是ListIterator的父接口. Iterator是Collection中取元素的方式,ListIterator局限于List Iterator只有hasNext(),next() ...

  6. http请求利器: 今天配置出了RESTClient,用MAVEN构建了UI运行包

  7. 排版字号对应多少pt

    各字号对应多少pt?初号= 42pt: 小初号= 36pt: 一号= 26pt: 二号= 22pt: 小二号= 18pt: 三号= 16pt: 四号= 14pt: 小四号= 12pt: 五号= 10. ...

  8. alloc和初始化的定义

    1.alloc是为原始实例进行分配内存,但是还不能使用 2.初始化的作用就是将一个对象的初始状态(即它的实例变量和属性)设定为合理的值,然后返回对象.它的目的就是返回一个有用的值

  9. MVC(模型-视图-控制器)的理解

    在 MVC 中,模型对象表示数据(例如日历应用程序中的待办事项或绘图程序中的图形),视图对象知道如何显示模型对象所表示的数据,控制器对象充当模型和视图的媒介.在“HelloWorld”应用程序中,模型 ...

  10. 数据结构《10》----二叉树 Morris 中序遍历

    无论是二叉树的中序遍历还是用 stack 模拟递归, 都需要 O(n)的空间复杂度. Morris 遍历是一种 常数空间 的遍历方法,其本质是 线索二叉树(Threaded Binary Tree), ...