[jQuery] Scroll-functietje doet te veel...

[The Milkman]

Ik heb een functietje die er met ScrollTop() voor zorgt dat wanneer de pagina een stukje naar beneden scrollt, de menubar blijft 'steken' aan de top van de pagina. Dat werkt goed.

Nu wil ik ook graag, wanneer aan die zelfde voorwaarde wordt voldaan, er een aantal links <a> worden aangepast. Dit met als doel dat de site weet dat de gebruiker naar beneden heeft gescrolled toen hij op een menu-link klikte. Ik wil dus een GET variable meegeven aan de menu-bar links.

Ik heb nu dit:

JavaScript:

    $(window).bind('scroll', function() {
         if ($(window).scrollTop() > 367) {
                $('nav, header').addClass('fixed');

                $("a").each(function() {      
                var theHref = $(this).attr("href");
                $(this).attr("href", theHref + "?scroll=1");
                });
         }
         else {
             $('nav, header').removeClass('fixed');
         }
    });

Nu weet ik dat de als jQuery naar scroll kijkt, hij elke pixel dat ik scroll deze functie opnieuw uitvoer.
Dat werkt prima voor addClass, want dubbele classes voegt hij toch niet toe.

Maar als je nu naar het middenstukje van de code kijkt, waar hij de links ophaalt, en "?scroll=1" eraan toevoegt, gaat het fout. Hij doet dat namelijk elke pixel opnieuw... met als resultaat:

JavaScript:

<nav class="menubar fixed">
        <ul>
            <li><a href="/?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1" class="activeLink">Home</a></li>
            <li><a href="?=html?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1?scroll=1">HTML</a></li>
        </ul>
    </nav>

Ik denk vast te moeilijk, maar ik kom er even niet uit...
Hoe zorg ik dat hij beneden de 367 pixels, slechts éénmaal alle links van een toevoeging voorziet? (En ook weer weghaalt als niet meer aan de voorwaarde wordt voldaan....

Thx.

[ Voor 0% gewijzigd door The Milkman op 02-08-2013 14:14 . Reden: syn.hightlighting ]

[Tharulerz]

Je kan gewoon een eventhandler aan de links hangen, en de link pas aanpassen als er iemand op klikt.

Voorbeeld:

JavaScript:

$("a").click(function(e){
    e.preventDefault();
    window.location = $(this).attr('href') + "?scroll=1";
});

[Verwijderd]

Misschien snap ik niet helemaal wat je bedoelt maar kan je er niet een simpel if'je omheen zetten?

JavaScript:

var counter = 0;
 $(window).bind('scroll', function() { 
    if ($(window).scrollTop() > 367) { 
       $('nav, header').addClass('fixed'); 
       $("a").each(function() {       
          if(counter != 0) {
             var theHref = $(this).attr("href"); 
             $(this).attr("href", theHref + "?scroll=1");
             var counter = counter + 1;
           }
        }); 
     } 
     else { 
        $('nav, header').removeClass('fixed');
           var counter = 0;
      } 
 });

Ik ben trouwens geen JS / jQuery pro, ben meer van PHP, dus er kunnen wat syntax foutjes inzitten ;-)

[ Voor 10% gewijzigd door Verwijderd op 02-08-2013 14:37 . Reden: Code-tags & indentation ]

[The Milkman]

Tharulerz schreef op vrijdag 02 augustus 2013 @ 14:19:
Je kan gewoon een eventhandler aan de links hangen, en de link pas aanpassen als er iemand op klikt.

Voorbeeld:

JavaScript:

$("a").click(function(e){
    e.preventDefault();
    window.location = $(this).attr('href') + "?scroll=1";
});

Hmm... het werkt ook nog...

Bedankt en kudo's

[The Milkman]

Verwijderd schreef op vrijdag 02 augustus 2013 @ 14:33:
Misschien snap ik niet helemaal wat je bedoelt maar kan je er niet een simpel if'je omheen zetten?

code:

var counter = 0;
 $(window).bind('scroll', function() { 
         if ($(window).scrollTop() > 367) { 
                $('nav, header').addClass('fixed'); 
                $("a").each(function() {       
                if(counter != 0) {
                     var theHref = $(this).attr("href"); 
                     $(this).attr("href", theHref + "?scroll=1");
                     var counter = counter + 1;
                }
                }); 
         } 
         else { 
             $('nav, header').removeClass('fixed');
             var counter = 0;
         } 
    });

Ik ben trouwens geen JS / jQuery pro, ben meer van PHP, dus er kunnen wat syntax foutjes inzitten ;-)

Jouw code lijkt aardig, maar als hij door de 'scroll-barriere' heen is, blijft hij de code uitvoeren

[Verwijderd]