<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. DataGridView的按钮列的点击事件

    private void dataGridView1_CellContentClick(object sender, DataGridViewCellEventArgs e) { ) { DataGr ...

  2. js弹出窗口的学习和使用

    Thickbox Thickbox是基于Jquery的,因此使用Thickbox需要下面四个文件: Thickbox.js----Thickbox主文件 CSS文件----Thickbox.css 最 ...

  3. vim的编码设置

    VIM的相关字符编码主要有三个参数 fencs: 它是一个编码格式的猜测列表.当用vim打开某个文件时,会依次取这里面的编码进行解码,如果某个编码格式从头至尾解码正确,那么就用那个编码 fenc:它是 ...

  4. static inline

    今天看到了这样一段代码, static inline BOOL IsEmpty(id thing) { return thing == nil || [thing isEqual:[NSNull nu ...

  5. JVM-JDK命令行工具

    JDK命令行工具 当我们进入JDK的安装目录里面的/bin目录,会发现有很多小工具,有我们熟悉的也经常用的java,javac,也有很多我们不怎么用到很陌生的工具.下面看看哪些平时不怎么用到的工具吧. ...

  6. Android弱网测试中关于网络检测的一些借鉴方法

    Android 平台下提供了一个android.net.ConnectivityManager类来监控当前的网络状态包括wifi.gprs.UMTS等.可以判断当前用户网络到底是WIFI还是移动网络, ...

  7. 给宏基装WIN8.1系统之问题与解决方法(原创)

    1.采用老毛桃U盘PE进入笔记本: 2.备份桌面文件以防丢失: 3.将下载好的Win8操作系统镜像加载到虚拟光驱,最好把操作系统拷贝到笔记本硬盘上,不然可能会出现意想不到的错误: 4.打开老毛桃桌面安 ...

  8. PHP面向对象的程序设计一些简单的概念

    一.面向对象的概述    数组和对象,都属于PHP中的复合类型(一个变量可以存储多个单元) 对象比数组更强大,不仅可以存储多个数据,还可以将函数存在对象中 对象的三大特性:封装,继承,多态 面向对象编 ...

  9. eclipse GIT使用

    新建工程(要和GIT上同名,同类型)->右键->team->add to index->commit->更新config文件->remote: fetch from ...

  10. OD调试4--绕过nag窗口

    先看一下程序的运行情况 先跳出了一个nag窗口 点确定 又跳出了一个NAG窗口,这是一些程序编写的时候常用的方法,设法让你购买正版软件, 于是今天呢,学会了四种绕过NAG的方法 我们先用OD加载进入这 ...