js Esegui una scroll scorrevole

Question

Ho seriamente una domanda sull'evento scroll. Ho provato a risolverlo tutta la notte, ma non potevo.

Sto provando ad attaccare una navigazione in alto. L'effetto stick verrà elaborato quando $(window).scrollTop() passa il punto prima della navigazione.

Il problema è, ci sarà un effetto "blink" (il suo processo di ritardo simili) su IE e Chrome, ma non su Firefox.

Durante la mia ricerca, sapevo che Firefox ha "scorrimento regolare" per impostazione predefinita.

Tuttavia, si prega di controllare questo esempio su Chrome o IE

http://www.backslash.gr/demos/jquery-sticky-navigation/

È così liscio come su Firefox, e il codice è proprio così semplice ......

Il punto è, sto facendo esattamente la stessa cosa come questo esempio, ma perché ho l'effetto 'blink' ??

È il trucco su CSS ??

C'è un modo per creare uno scrool liscio come quello su firefox di js ??

Grazie mille per il vostro aiuto.

$(window).on('scroll', Sticky); 

function Sticky(){ 
    $(this).scrollTop() > anchor.offset().top 
    ? nav.css({ 'position': 'fixed', 
         'z-index': z_index, 
         top: y, 
         left: x, }) 
    : nav.css({ 'position': 'static', }); 
}; 

Answer 1

Guardando il codice di esempio incompleto è davvero difficile determinare cosa sta succedendo, quindi per favore o aggiornare la tua domanda con codice completo, o meglio - caricare una JSFiddle per servire a noi come esempio e siamo in grado di aggiornare direttamente esso con le modifiche necessarie Finora (in base a quello che ho detto prima) sembra che stai ricevendo un effetto flickering a causa di errori di battitura nel codice di esempio:

? nav.css({ 'position': 'fixed', 
        'z-index': z_index, 
        top: y, 
        left: x, }) 
: nav.css({ 'position': 'static', }); 

in cui non sei che chiude la serie di proprietà e valori CSS che deve essere applicato (lo stai terminando con una virgola ,) e non hai racchiuso alcune proprietà CSS in una singola virgoletta '. Il codice dovrebbe essere:

? nav.css({ 'position': 'fixed', 
        'z-index': z_index, 
        'top': y, 
        'left': x }) 
: nav.css({ 'position': 'static' }); 

Questo è, naturalmente, a condizione che avete già impostato le variabili z_index, y e x anticipo.

EDIT & NOTA BENE: Ho creato un nuovo JSFiddle con il codice demo originale. La demo a cui hai fatto riferimento è protetta da copyright, quindi per favore attribuisci la tua gratitudine all'autore originale e non a me, se questo ti aiuta. Il codice che ho postato JSFiddle con è disponibile come download gratuito, però. Quindi suppongo che sia OK riutilizzarlo anche per scopi dimostrativi. Cambia quel codice per soddisfare i tuoi requisiti e aggiornalo alla nuova versione ogni volta che lo aggiorni. Ti aiuterà a tenere traccia di dove stai facendo qualcosa di sbagliato (se non del tutto). ;)

Answer 2

Penso che potresti confondere due cose qui.

1. osservare il codice di lavoro a cui è stato collegato. c'è un batter d'occhio se si scorre su chrome o IE o firefox usando lo scroller del mouse.
2. L'intermittenza è perché si cambia posizione all'improvviso. Prova a cambiare il js in modo da animare la posizione piuttosto che cambiarne improvvisamente il valore.

Come altri hanno detto che collegarsi a un codice funzionante e aspettarsi una risposta mostrando un trucco potrebbe non aiutare tutti noi. Prova ad aggiungere animate sulla linea di cambio di posizione di js e vedi se questo aiuta.

Non c'è nessun trucco qui. È tutto in codice, quindi leggi la fonte e divertiti.