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


ZooMove: jQuery Plugin om afbeeldingen te zoomen op zweven

Als je ooit een e-commercesite hebt bekeken, heb je waarschijnlijk het zoomeffect van de afbeelding gezien. Je zweeft een productfoto en dat deel van de afbeelding wordt vergroot voor een duidelijker beeld .

De ZooMove-plug-in is een geweldige manier om dit effect op uw site te repliceren . Het wordt mogelijk gemaakt door jQuery, dus u kunt dit snel en zonder veel code gebruiken.

ZooMove is volledig gratis en open source, beschikbaar op GitHub voor elke nieuwsgierige ontwikkelaar. Het kan worden geïnstalleerd via npm, Bower, Yarn of direct worden gedownload van CDNJS .

Voor het instellen van een ZooMove-afbeelding hebt u drie specifieke bestanden in uw paginakop nodig:

  1. jQuery
  2. ZooMove CSS
  3. ZooMove JS

Beide ZooMove-bestanden kunnen worden verkleind als u sneller een pagina wilt laden. U kunt het CSS-bestand ook combineren in uw hoofdstijlblad als dat eenvoudiger is.

Alle echte magie vindt plaats in de HTML-code waar u HTML5- data-* attributes voor de verschillende effecten kunt instellen.

Hiermee kun je je eigen aangepaste zoomeffect maken op basis van vier verschillende parameters:

  1. data-zoo-scale - definieert de totale zoomfactor bij zweven (bijv. 2.0 voor 200%)
  2. data-zoo-move - bepaalt of het beeld meebeweegt met de cursor
  3. data-zoo-over - definieert de ingezoomde afbeelding boven het origineel
  4. data-zoo-cursor - definieert het cursorpunt

Met een laatste vijfde parameter kun je definiëren wat de nieuwe afbeeldings-URL zou moeten zijn (indien nodig).

U kunt ZooMove gebruiken in alle belangrijke browsers, inclusief IE9 +. Deze plug-in wordt breed ondersteund en biedt een geweldige gebruikerservaring.

Als u op zoek bent naar een eenvoudige hover-to-zoom-bibliotheek, is ZooMove een uitstekende keuze. Het is licht genoeg om op elke website te draaien en het wordt mogelijk gemaakt door jQuery, dus je hoeft niet zo veel code te schrijven om het te laten werken.

Ga naar de hoofdpagina om deze in actie te zien en bekijk de documentatie op GitHub voor meer informatie.

App Store-optimalisatie: een praktische gids voor app-ontwikkelaars

App Store-optimalisatie: een praktische gids voor app-ontwikkelaars

U hebt zojuist uw eerste iPhone-app gemaakt en deze in de App Store gepubliceerd. Super goed! Maar de app-installaties gaan niet door het dak. Wat nu? U moet een aantal optimalisaties uitvoeren.App Store Optimization (ASO) zijn de tactieken die u kunt gebruiken om uw app hoger te classificeren in de App Store

(Technische en ontwerptips)

Hoe Instagram-filters op webafbeeldingen toe te passen

Hoe Instagram-filters op webafbeeldingen toe te passen

Velen zijn dol op het gebruik van Instagram en de filters die bij de app zijn geleverd, om hun foto's interessanter en mooier te maken. Tot nu toe is het gebruik van deze filters beperkt tot gebruik in de app. Wat als je Instagram-filters op webafbeeldingen wilt gebruiken, buiten de app, zoals foto's die je in je persoonlijke blog of website wilt plaatsen

(Technische en ontwerptips)