no.hideout-lastation.com
Paradis For Designere Og Utviklere


Parallax Scrolling gjorde det enkelt med StickyStack.js

Parallax effekter griper oppmerksomheten fort. Disse effektene holder visse bakgrunner i sikte mens du ruller nedover siden. Du finner parallaxrulling på mange nettsteder og WordPress-temaer, og de er en stor del av moderne webdesign.

Du kan også bygge en unik parallax stil med StickyStack.js plugin. Den er bygd på jQuery og holder hver hovedside seksjonen festet til toppen mens du ruller ned.

Dette skaper en illusjon av et lagdelt nettsted hvor hver side "stabler" på toppen av den andre. Det er veldig kult og ganske enkelt å sette opp på egen hånd.

Selv om det er ganske enkelt å sette opp, krever det litt forståelse av frontend-utviklingen.

Du må først opprette individuelle sidestykker inne i hovedbeholderen. På denne måten får du alt som er vedlagt i HTML, slik at du kan målrette alt med StickyStack jQuery-funksjonen.

Det kommer også med noen få muligheter hvor du kan tilpasse foreldrebeholderen, elementene som skal stables og en mulig bokseskygge hvis du liker den effekten.

Her er en prøvebit av kode fra GitHub-siden:

 $ ('main content-wrapper'). StickyStack ({containerElement: '.main-content-wrapper', stackingElement: 'section', boxShadow: '0 -3px 20px rgba (0, 0, 0, 0.25)' }); 

Selv om dette ikke har blitt oppdatert om to år, er det fortsatt et veldig pålitelig plugin. Det fungerte i alle nettleserne jeg testet (Chrome, Safari, og Firefox) med støtte for alle versjoner av jQuery .

I tillegg er den minifiserte filen bare 2KB, som er en anstendig størrelse for et plugin.

For å lære mer, besøk hovedrekorden og se hva StickyStack kan tilby. Jeg tror det fungerer best på nettsider for enkeltsider eller destinasjonssider med store fullskjermbakgrunner .

Du kan også sjekke ut en live-demo på CodePen hvis du vil se hvordan dette ser ut på et live-nettsted.

Slik debuger du nettsiden i iPad

Slik debuger du nettsiden i iPad

Med tusenvis av mobile brukere i dag, er det nødvendig å bygge nettsteder som kan vises på mobilenheter. Heldigvis har vi mange verktøy og muligheter for feilsøking av nettsteder på mobile plattformer . Du kan bruke Adobe Edge Inspect, Google Chrome Emulation eller XIP.io for å nevne noen.Hvis du utvikler utelukkende i et OS X- og IOS-miljø, trenger du kanskje ikke disse tredjepartsverktøyene. Apple h

(Tekniske og design tips)

40 iPhone 8 og iPhone X PSD og maler

40 iPhone 8 og iPhone X PSD og maler

Apple lanserte nylig sine etterlengtede telefoner iPhone 8, iPhone 8 Plus og iPhone X med futuristiske funksjoner og forskjellige prispunkter. For iPhone-entusiaster betyr det å tømme lommene for å få de nye telefonene, men for web- og grafiske designere, betyr det å finne mock-ups og maler av de nye telefonens design.For

(Tekniske og design tips)