nl.hideout-lastation.com
Paradijs Voor Ontwerpers En Ontwikkelaars


Parallax-scrollen gemakkelijk gemaakt met StickyStack.js

Parallax-effecten trekken de aandacht snel. Deze effecten houden bepaalde achtergronden in beeld terwijl u over de pagina scrolt. Parallax scrollen vindt u op veel websites en WordPress-thema's en ze vormen een groot deel van het moderne webdesign.

Je kunt ook een unieke parallax-stijl maken met de plug-in StickyStack.js . Het is gebouwd op jQuery en houdt elke hoofdpaginasectie aan de top als u naar beneden scrolt.

Dit creëert de illusie van een gelaagde website waar elke pagina op de andere stapelt. Het is echt cool en vrij eenvoudig om zelf in te stellen.

Hoewel het vrij eenvoudig is in te stellen, vereist het enig begrip van de ontwikkeling van de frontend.

U moet eerst afzonderlijke paginasecties maken in de hoofdcontainer. Op deze manier heb je alles ingesloten in de HTML, zodat je alles kunt richten met de jQuery-functie StickyStack.

Het komt ook met een paar opties waar je de bovenliggende container, de elementen die moeten worden gestapeld en een mogelijke vakschaduw kunt aanpassen als je dat effect leuk vindt.

Hier is een stukje code van de GitHub-pagina:

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

Hoewel dit na ongeveer twee jaar nog niet is bijgewerkt, is het nog steeds een zeer betrouwbare plug-in. Het werkte in alle browsers die ik heb getest (Chrome, Safari en Firefox) met ondersteuning voor alle versies van jQuery .

Bovendien is het verkleinde bestand slechts 2 KB, wat een behoorlijke omvang is voor een plug-in.

Ga voor meer informatie naar de hoofdrepo en bekijk wat StickyStack kan bieden. Ik denk dat dit het beste werkt op websites met één pagina of bestemmingspagina's met grote achtergronden op volledig scherm .

Je kunt ook een live demo bekijken op CodePen als je wilt zien hoe dit eruit ziet op een live site.

Hoe ruimte op de harde schijf vrij te maken zonder iets belangrijks te verwijderen

Hoe ruimte op de harde schijf vrij te maken zonder iets belangrijks te verwijderen

Ik wilde ooit een 9GB-game installeren op mijn 20 GB-systeemschijf met slechts 1 GB vrije ruimte (was de vereiste van het spel). Met weinig of geen ruimte voor het verwijderen van gegevens, moest ik zoeken naar manieren om ruimte vrij te maken op mijn C-schijf zonder dat er belangrijke gegevens moesten worden verwijderd

(Technische en ontwerptips)

Deze Red-less Strawberry Photo is het internet breken

Deze Red-less Strawberry Photo is het internet breken

Internet zit vol met foto's die je een heel ander perspectief geven als je ze van dichtbij bekijkt. De beroemde 3D-kunst en geforceerde perspectieffotografie zijn goede voorbeelden. Op dezelfde manier circuleert er een interessant beeld op het internet, wat mensen verbijstert over de eigenschappen ervan

(Technische en ontwerptips)