javascript - In vanilla JS, how can I add or remove a class from an element based on whether the scroll is at the top? -

-

i'm trying make sticky nav have particular class when not scrolled @ top, , not have class when scrolled @ top. sorry if that's confusing.

what i'm stuck on right fact in bottom piece of code doc.scrolltop == 0 evaluating true whenever scroll mouse. doing wrong?

     htmlelement.prototype.removeclass = function(remove) {         var newclassname = "";         var i;         var classes = this.classname.split(" ");         for(i = 0; < classes.length; i++) {             if(classes[i] !== remove) {                 newclassname += classes[i] + " ";             }         }         this.classname = newclassname;     }         window.onscroll = function() {          var body = document.body; //ie 'quirks'         var doc = document.documentelement; //ie doctype         doc = (doc.clientheight) ? doc : body;          if ( doc.scrolltop == 0 ) {             document.getelementbyid('top').removeclass('scrolling');             console.log("doc.scrolltop == 0");//test         } else {             document.getelementbyid('top').addclass('scrolling'); // need make addclass function ...             console.log("doc.scrolltop != 0");//test         }     };

try using distance top:

var distance = (window.pageyoffset || doc.scrolltop) - (doc.clienttop || 0);

and in code: 

 htmlelement.prototype.removeclass = function(remove) {     var newclassname = "";     var i;     var classes = this.classname.split(" ");     for(i = 0; < classes.length; i++) {         if(classes[i] !== remove) {             newclassname += classes[i] + " ";         }     }     this.classname = newclassname; }     window.onscroll = function() {      var body = document.body; //ie 'quirks'     var doc = document.documentelement; //ie doctype     doc = (doc.clientheight) ? doc : body;      var distance = (window.pageyoffset || doc.scrolltop) - (doc.clienttop || 0);      if ( distance === 0 ) {         document.getelementbyid('top').removeclass('scrolling');         console.log("doc.scrolltop == 0");//test     } else {         document.getelementbyid('top').addclass('scrolling'); // need make addclass function ...         console.log("doc.scrolltop != 0");//test     } };

whilst works, suggest looking @ improving js code in line more modern practices.


Comments

Post a Comment

Popular posts from this blog

Delphi XE2 Indy10 udp client-server interchange using SendBuffer-ReceiveBuffer -

-
i use delphi xe2 , indy10 udp protocol. can't receive server echo on client side if use receivebuffer method. got "socket error # 10040" although send small echo message server client. console application illustrate problem below. in advance. program project1; {$apptype console} {$r *.res} uses system.sysutils, idglobal, idbasecomponent, idcomponent, idsockethandle, idudpclient, idudpserver, idudpbase, idstack; type tudp_serv = class(tidudpserver) procedure udpsvudpread(athread: tidudplistenerthread; adata: tidbytes; abinding: tidsockethandle); end; var udpserver: tudp_serv; udpcl: tidudpclient; bsnd, brcv: tbytes; s: string; k: integer; //============================================================================== procedure tudp_serv.udpsvudpread(athread: tidudplistenerthread; adata: tidbytes; abinding: tidsockethandle); begin writeln(' server read: ' + tohex(adata, length(adata))); abinding sendto(peerip, peerport, adat...
Read more

Qt ActiveX WMI QAxBase::dynamicCallHelper: ItemIndex(int): No such property in -

-
i new windows programming. here goes code objiwbemlocator = new qaxobject("wbemscripting.swbemlocator"); objwmiservice = objiwbemlocator->querysubobject("connectserver(qstring&,qstring&)",qstring("."),qstring("root\\cimv2")); qaxobject* returnlist = objwmiservice->querysubobject("execquery(qstring&)", qstring("select * %1").arg(domain)); qaxobject* result = returnlist->querysubobject("itemindex(int)", 0); i getting error on runtime qt activex wmi qaxbase::dynamiccallhelper: itemindex(int): no such property in but itemindex method exists msdn says the itemindex method not work collections not contain swbemobjects, such swbemmethodset, swbemnamedvalueset, swbemprivilegeset, swbempropertyset, , swbemqualifierset. what selecting ? have tried iterating on collection ? plus need minimum windows vista itemindex method. hope helps
Read more

Enable autocomplete or intellisense in Atom editor for PHP -

-
i'm first time user of atom editor php code. atom can autocomplete built-in functions of php. possible make editor autocomplete custom function written in separate file? function.php <?php function printsomething() { echo "hello world"; } index.php <?php require_once "function.php"; printsomething(); // autocompleted atom editor while typing thanks in advance. there text file in %userprofile%.atom called snippets.cson. in there can add snippet. more this: http://flight-manual.atom.io/using-atom/sections/snippets/ but need think can use later on other files well. otherwise need copy , paste.
Read more