Kjapp og trygg hosting for Wordpress

Sideovergang

adeneo

Medlem
Prøv å sjekk hva verdien av scrollTop er:

PHP:
console.log($(window).scrollTop());

så er det lettere å vite hvorfor det ikke virker?
 

rimby

Medlem
Den blir 0 når jeg først trykker på en tab når jeg befinner meg på forsiden
Den blir rundt 625 når jeg er i "content" og trykker på en tab
Ser ingenting galt her?
 

rimby

Medlem
Nettsia ble vist ikke helt ferdig, men nå er denne oppgaven levert. Har lært mye mer av deg enn på dette temaet enn av noen annen. Men jeg skulle gjerne ha lært meg å sette opp en slik dynamisk nettside som fungerer skikkelig med navigeringen. Enten med history.js eller pushState og popState. Men synes det var utrolig vanskelig å finne en gode eksempler på nettet som var enkel å følge. Som oftest hadde de satt opp en nettside allerede som var ganske annerledes enn min egen.
Du vet vel ikke av noen gode tutorials på det?
 

adeneo

Medlem
Jeg kommer egentlig ikke på noen gode tutorials i farten, og jeg fant ut av dette for en stund siden og brukte vel da stort sett MDN som kilde ettersom Mozilla er ansvarlig for utviklingen av ECMAscript (som er javascript) og som oftest er tidligst ute med informasjon om nye funksjoner, og man kan stole på at informasjonen er riktig.
MDN er ment litt mer for utviklere, og det er ikke akkurat noen tutorials eller veldig gode eksempler, men mer litt oversikt over hva som er tilgjengelig og hva som er god praksis for å bruke det.

Problemet med History API'en har vært at Microsoft ikke har støtte for dette i det hele tatt, samt at mange har vært redd for å bruke det noe særlig på grunn av SEO og eldre nettlesere, noe som er bare tull. Dersom man setter det opp slik at sidene faktisk eksisterer og bare overstyrer lenkene med "preventDefault" og bruker pushState i stedet så er det ikke noe problem.

history.js er noe brukt, men problemet med den har vært at prosjektet er forlatt, og det har ikke vært gjort noen oppdateringer der på over et år, som er mye for et slikt prosjekt, slik at det er ingen garanti for at det virker optimalt.
En annen ting er at history.js kom før jQuery's on(), og det som i history.js gjøres som :

History.Adapter.bind(window,'popstate',function(){...});

Kan nå gjøres med on(), som støtter alle javascript eventer :

$(window).on('popstate', function() {...});

Og ettersom History API'en er ganske konsekvent i de nettleserene som støtter dette er det ikke behov for noe normalisering av ting som en plugin ofte er grei til, og den eneste fordelene med history.js blir da at den faller tilbake på hashen, noe som du nå har sett ikke er spesielt vanskelig å få til når man får litt dreisen på det og får testet litt frem og tilbake, uten at man trenger en plugin av den grunn, og det er vel derfor history.js har blitt forlatt også, da det egentlig ikke er noe behov for den lengre.

Trikset er å bruke pushstate til å endre adresser, slik du har prøvd, og å binde til popstate for å endre innhold og oppdatere når fremover/bakover knappene brukes, men popstate fyrer også på første sidelastning i enkelte nettlesere, samt at det krever litt prøving og feiling og ofte en del knoting for å få alt til å virke optimalt i alle nettlesere, både med og uten støtte for History API'n, uten javascript osv.
 
Topp