Magic HTML Client Edges - Deel 3 Introductie In dit deel van de serie, we effectief uitvoeren van een project. Het project gaat over een webpagina. Het doel van het project is dat wanneer je de muisaanwijzer naar de rand van de webpagina, een ruit met een rekenmachine of een ander nuttig instrument moet in de pagina te scrollen; je kunt doen wat je wilt doen met het gereedschap; wanneer u klikt op het lichaam van de pagina, buiten de ruit, het paneel schuift terug in de rand. De fundamenten van het project zijn in de vorige delen van de serie.
Ik heb veel detail uitleg gedaan in de vorige delen van de serie. Verklaringen in dit en het volgende deel van de serie zal waar mogelijk worden samengevat. De tool voor het paneel in ons project is een rekenmachine. De details van de rekenmachine zal niet worden gegeven. In het volgende deel van de reeks, zullen we de volledige code van het project. Het project Na het doorlopen van de basics we zijn nu in de positie om te komen met de technische eisen. We weten nu wat mogelijk is en wat niet mogelijk is voor zover de DOM JavaScript en HTML betreft.
Voordat we kijken naar de technische vereisten laten we weer opnieuw kijken naar de behoeften van de gebruikers: - Wanneer de muisaanwijzer een rand bereikt, moet het paneel zelf te scrollen in de pagina. Het scrollen zal zodra het uiteinde van het paneel aan de rand stoppen. Door de beperkingen van HTML DOM eigenschappen en onverenigbaarheid van browsers, zullen wij alleen de linker en bovenste rand magische magic rand hebben. - Wanneer de gebruiker klikt op de BODY element buiten de ruit, dient de ruit terug in de rand schuiven.
Technische vereisten De volgende vereisten zijn gerelateerd aan de eerste gebruiker eis boven: - Er zal een mimic rand aan de linkerkant van de klant gebied. Dit mimic rand zal een DIV element. - Er wordt een nabootser rand aan de bovenkant van de klant gebied. Dit mimic rand zal een HR-element; Ik zal later uitleggen waarom. - Er wordt geen mimic rand aan de rechterkant of aan de onderkant van de cliënt gebied. Dit is vanwege de hiervoor genoemde beperkingen. - Elke mimic rand zal reageren op een unmouseover evenement, die zal leiden tot het venster in de pagina te scrollen.
- Als gevolg van de hierboven genoemde beperkingen, zal de ruit 25% client lijn ver van de linkerbovenhoek van de klant gebied te doorlopen. - Terwijl de ruit wordt het scrollen in de pagina, geen andere instantie van de ruit kan worden geschoven in de pagina. - Terwi