javascript - Nav anchor doesn't apply active class correctly while scroll jQuery -

-

I have a website, in & lt; Header & gt; The sticky nav is under the element, as long as I scroll to a section, it activates a class using data-attributes , here's the bug: when I class If I scroll to active , half the section also does not scroll according to the section section.

What do I need active to turn on the class until I get the anchor of each section, I leave my code below a JSfield, you can see that What is the problem, I hope you guys can help me.

HTML: 

  & lt; Header class = "testheader" & gt; & Lt; Nav id = "cloud_nav" class = "absolute" & gt; & Lt; Ul & gt; & Lt; Li & gt; & Lt; A href = "#" data-scroll = "overview" & gt; Section 1 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" data-scroll = "readiness" & gt; Section 2 & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" data-scroll = "support" & gt; Section 3 & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Neo & gt; & Lt; / Header & gt; & Lt; Section data-anchor = "overview" style = "background: red; font-size: 25px;" & Gt; & Lt; / Section & gt; & Lt; Section data-anchor = "readiness" style = "background: green; font-size: 25px;" & Gt; & Lt; / Section & gt; & Lt; Section data-anchor = "support" style = "background: #ccc; font-size: 25px;" & Gt; & Lt; / Section & gt; & Lt; / Div & gt;

Javascript: 

  & lt; Script type = "text / javascript" & gt; ('Data' scroll), scrollpoint = $ ('section [data-anchor]' ('click', function) (var scroll anchor = $ (this). $ ('Body, html'). Animate ({scrollTop : ScrollPoint}, 500); return returned;}) var navOffset = $ ('# cloud_nav') offset () top .. $ (window) .scroll (function () {var scrollPos = $ (window) .scrollTop () ; If (scrollPos> = navOffset) {$ ('# cloud_nav'). RemoveClass ('absolute'); $ ('$ (' section '(' active '); $ (' # cloud_nav a ') Eq (i) .addClass ('active');}})} and {$ ('# cloud_nav'). AddClass ('absolute'); $ ('# cloud_nav a.active'). RemoveClass ('active' ); $ ('# Cloud_nav a: first'); $ '(' # cloud_nav a: first ') .addClass (' active ');}}); & lt; / script & gt;      
  
 text "> 
 Was it done after you?  
  
 First, I changed the account to the size of the title to calculate the  scrollPoint : 
 
  scrollPoint = $ ('section [Data-anchor = '' + scrollAnchor + '"]'). Offset () top-$ ('# cloud_nav'). Outer heights (); After that,  decrease  50 pixels, we  add  the height of that nav, where it is detecting the scroll position:  
  if ($ (this) .bizon (). Top  
 
 Now scroll the anchor to the right place and the active classes are being switched correctly.

Comments

Post a Comment

Popular posts from this blog

winforms - C# Form - Property Change -

-
I have a form that has a property named car A class with many properties. The Properties is being displayed on the current car on the basis of some user actions that are being displayed. So I have to know whether the property has been allocated or set to zero. I'm aware of INotifyPropertyChanged , but in my case I'm not sure that since this change I have changed my car properties car do not want to monitor the property. Any idea how to accomplish this? In advance thank you If you have created a true asset in your class then You should be a great and setter, you can add the code directly to the form property in order to take action on the basis of "form": Public partial category Form 1: form {public form 1 () {InitializeComponent (); } // define car square public class car {public string name = string. Empty; } // private car to keep the value of the current car private variable _car = null; // Property of public form which you can ru...
Read more

javascript - amcharts makechart not working -

-
I am trying to create an amiratars serial chart on my Durandal single page application. This chart was working fine on Chrome browser but it is not working on IE. Can you please help me in this regard. Error while using Amcharts. The Macchart () method does not support the object in this object in IE.
Read more

java - Algorithm negotiation fail SSH in Jenkins -

-
I am trying to do SSH on the local server from Jenkins, but the following error has been thrown: [SSH] Exception: Algorithm negotiation fail com.jcraft.jsch.JSchException: algorithm talk com.jcraft.jsch.Session.receive_kexinit (Session.javaatar20) at com.jcraft.jsch.Session.connect (Sesson at com.jcraft.jsch.Session.connect (Session.java:150) at org.jvnet.hudson.plugins.SSHSite.createSession (SSHSite.java:141) on failed failed org.jvnet.hudson.plugins. java: 286) .SSHS on org.jvnet.hudson.plugins.SSHBuildWrapper.executePreBuildScript (SSHBuildWrapper.java:75) on Org.jvnet.hudson.plugins.SSHBuildWrapper.setUp (SSHBuildWrapper.java59) ite.executeCommand (SSHSite.java151) on hudson.model.Build $ BuildExecution.doRun hudson.model.AbstractBuild $ AbstractBuildExecution.run (AbstractBuild.java:533) to (Build.java:154) hudson.model.Run.execute ( Run.java:1754) in ended .model.FreeStyleBuild.run (FreeStyl hudson.model.ResourceController.execute (ResourceController.java:89) on hudson.mod...
Read more