Leer hoe u in Adobe Muse scrolleffecten toevoegt aan browser- en achtergrondvullingen van een website.

Opmerking:

Adobe Muse voegt geen nieuwe functies meer toe en stopt op donderdag 26 maart 2020 met de ondersteuning. Zie de pagina Einde van levensduur voor Adobe Muse voor meer informatie en assistentie.

Scrolleffecten toepassen op afbeeldingen die zijn ingesteld als een browservulling

Met scrolleffecten kunt u de snelheid van afbeeldingen die de browserachtergrond vullen en onder of naast elkaar geplaatste pagina-elementen instellen. Scrolleffecten kunnen worden toegepast op browservullingen die naast elkaar geplaatste, passend of schermvullend geschaalde achtergrondafbeeldingen of achtergrondafbeeldingen op oorspronkelijke grootte gebruiken. De browservulling wordt met het verschuiven van de pagina mee verplaatst, op basis van de richting en snelheid die u hebt ingesteld in de sectie Schuiven van het menu Vulling browser.

Opmerking:

De scrollopties worden grijs weergegeven en zijn pas beschikbaar als u via het menu Vulling browser een afbeelding toevoegt aan de achtergrond van de browservulling. U kunt geen scrolleffecten toepassen op een browservulling die alleen met een effen kleur of met een verloopkleur is gevuld.

Scrolleffecten toevoegen aan Vulling browser

Voer de volgende stappen uit om scrollbewegingseffecten in te stellen voor browservullingen:

  1. Kies Pagina > Pagina-eigenschappen in de ontwerpweergave. Stel het veld Minimumhoogte op het tabblad Lay-out in op 2.000 pixels. Dit zorgt ervoor dat de pagina lang genoeg is om te schuiven. Klik op OK om de wijzigingen op te slaan en het deelvenster Pagina-eigenschappen te sluiten.
Werk het veld Min. hoogte in de Pagina-eigenschappen bij om de pagina langer te maken.
Werk het veld Min. hoogte in de Pagina-eigenschappen bij om de pagina langer te maken.

  1. Klik op de koppeling Vulling browser in het regelpaneel. Klik op het tabblad Vulling op het mappictogram naast de sectie Afbeelding om een afbeeldingsbestand op het bureaublad te kiezen. Kies de gewenste optie in het menu Aanpassen en schakel de optie Schuiven in.
Voeg een achtergrondafbeelding toe die in het browservenster wordt weergegeven.
Voeg een achtergrondafbeelding toe die in het browservenster wordt weergegeven.

  1. Klik op het tabblad Schuiven. Schakel het selectievakje Beweging in.
Schakel het selectievakje Beweging in om de scrolleffecten in te schakelen in het menu Vulling browser.
Schakel het selectievakje Beweging in om de scrolleffecten in te schakelen in het menu Vulling browser.

Neem een moment om de sectie Schuiven van het menu Vulling browser te bekijken. Het veld in het middelste gedeelte (momenteel ingesteld op 0 px) komt overeen met de hoofdpositie (de positie van de T-vormige handgreep) die de beweging bepaalt. De standaardinstelling van 0 px betekent dat de T-vormige handgreep is ingesteld op de bovenste rand van het browservenster.

Het aantal pixels dat in het veld Hoofdpositie is opgegeven, betekent dat de wijzigingen die u instelt in de sectie Beginbeweging worden verplaatst (in die richting en bij die snelheid) terwijl de pagina naar die locatie wordt geschoven. De bovenrand van de pagina begint bij 0 en het aantal pixels neemt toe naarmate u verder omlaag schuift op een pagina. (In het regelpaneel en in het deelvenster Transformeren wordt de term ''Y-waarde'' gebruikt om de afstand tot aan de bovenrand van de pagina aan te geven.)

De in de sectie Eindbeweging ingevoerde waarden worden toegepast als de pagina voorbij de hoofdpositie (locatie van de T-vormige handgreep) wordt geschoven.

Het element waarop het scrolleffect beweging is toegepast (in dit geval de naast elkaar geplaatste afbeeldingen die als de browservulling zijn ingesteld) verplaatst zich in de richting(en) waarvoor in dit veld een hogere waarde dan 0 is ingesteld. Als de waarde 0 is ingesteld voor zowel de horizontale als de verticale richting, staat het element in feite vast op de pagina en verplaatst het zich niet.

U ziet dat naast de waarden in de velden in de sectie Beginbeweging een kleine letter 'x' staat. Deze x verwijst naar een vermenigvuldigingsfactor. In de afbeelding met opties voor de browservulling geeft de sectie Beginbeweging aan dat de browservulling omhoog wordt verplaatst, met een vermenigvuldigingsfactor van 1 keer de scrollsnelheid (dezelfde snelheid). Als de bezoeker de pagina sneller schuift, wordt de beweging van het scrolleffect versneld en aan dit tempo aangepast.

In de sectie Horizontaal (links en rechts) wordt '0' weergegeven in het veld. Dat betekent dat de browservulling niet horizontaal naar links of rechts wordt verplaatst.

De sectie Eindbeweging heeft een vergelijkbare interface. In de afbeelding met opties voor de browservulling is de browservulling ingesteld om met 1 keer de snelheid van de beweging omhoog te worden verplaatst. De vulling wordt niet horizontaal verplaatst.

Opmerking:

Houd de muisaanwijzer boven de informatieknop (het i-pictogram) linksonder in het tabblad Schuiven om te lezen hoe scrolleffecten worden toegepast op een browservulling.

  1. Klik op de pijlknoppen in de sectie Beginbeweging om de verticale richting (naar boven of beneden) en/of de horizontale richting (naar links of rechts) op te geven om zo de richting te bepalen van de verplaatsing van de browservulling.
  2. Geef in de sectie Beginbeweging numerieke waarden op of klik op de pijlknoppen omhoog en omlaag om de horizontale en verticale schuifsnelheid in te stellen. Deze instellingen worden hieronder gedetailleerder beschreven. Als het veld Snelheid is ingesteld op 0, wordt het element niet in die richting verplaatst tijdens het schuiven (voordat de hoofdpositie is bereikt).
  3. Werk de waarden in de sectie Eindbeweging bij om de gewenste richting in te stellen. Typ numerieke waarden in de overeenkomende velden om de snelheid voor de scrolleffecten in te stellen.
  4. Als u het menu Vulling browser wilt sluiten, klikt u op een willekeurige plaats op de pagina.
  5. Kies Bestand > Voorvertoning van pagina weergeven in browser om de pagina in een nieuw browservenster te laden. Schuif de pagina om de scrolleffecten beweging in actie te zien.
  6. Als u klaar bent met testen, sluit u de browser en keert u terug naar Muse.

Scrollbeweging toepassen op een achtergrondvulling van een pagina-element

Scrolleffecten toevoegen aan achtergrondvulling

De scrollbeweging kan worden toegepast op objecten op de pagina met naast of onder elkaar geplaatste achtergrondafbeeldingen als vulling. Voer de volgende stappen uit:

  1. Kies Pagina > Pagina-eigenschappen als u een pagina bewerkt in de weergave Ontwerpen. Stel een veel hogere waarde in bij Min. hoogte, bijvoorbeeld 2000 pixels, zodat de pagina lang genoeg is om te schuiven. Klik op OK om de wijzigingen op te slaan en het deelvenster Pagina-eigenschappen te sluiten. U kunt ook genoeg pagina-inhoud toevoegen om een langere pagina te maken.
  2. Selecteer de tool Rechthoek in de weergave Ontwerpen in het regelpaneel.
  3. Teken een rechthoek op de pagina.
  4. Gebruik het menu Vulling om naast of onder elkaar geplaatste achtergrondafbeeldingen in te stellen als vulling voor de rechthoek.
Voeg een achtergrondafbeelding toe om de rechthoek te vullen en stel de gewenste weergaveopties in het menu Vulling in.
Voeg een achtergrondafbeelding toe om de rechthoek te vullen en stel de gewenste weergaveopties in het menu Vulling in.

  1. Klik op het tabblad Schuiven in het menu Vulling en stel de scrollopties in.
  1. Klik op het tabblad Schuiven in het menu Vulling. Schakel het selectievakje Beweging in en stel de scrollopties in.
Gebruik het tabblad Schuiven van het menu Vulling om Beweging in te stellen voor scrolleffecten.
Gebruik het tabblad Schuiven van het menu Vulling om Beweging in te stellen voor scrolleffecten, en de richting en de snelheid van de verplaatsing op te geven.

Er verschijnt een T-vormige handgreep boven het element dat is ingeschakeld voor scrollbeweging. De handgreep is een visuele weergave van de hoofdpositie (die momenteel is ingesteld op 100 px boven het element). Het pictogram in de middelste sectie van het tabblad Schuiven komt overeen met de positie van de T-vormige handgreep op de pagina. U kunt de hoofdposities opnieuw instellen op wanneer scrolleffecten optreden door een nieuwe waarde op te geven in het middelste veld of door de T-vormige handgreep op de pagina te slepen. Wanneer u de T-vormige handgreep sleept, wordt het gebied boven de hoofdpositie tijdelijk grijs weergegeven.

Sleep de T-vormige handgreep, die een visuele weergave van de hoofdpositie is.
Sleep de T-vormige handgreep naar de gewenste plaats op de pagina.

Opmerking:

De T-vormige handgreep hoeft niet boven het geselecteerde element uit te steken. U kunt de T-vormige handgreep slepen, zodat deze wordt uitgelijnd met de bovenrand van een element. U kunt de handgreep ook zodanig slepen dat deze onder een element uitsteekt.

Muse biedt volledige flexibiliteit tijdens het ontwerpproces, omdat u ervoor kunt kiezen om de handgrepen te slepen of een getal in te voeren in het veld Hoofdpositie om precies de verplaatsing te bepalen die optreedt wanneer een bezoeker de pagina schuift.

Het tabblad Schuiven in het menu Vulling werkt op dezelfde manier als het tabblad Schuiven in het menu Vulling browser:

  1. Zorg dat een voor scrolleffecten beweging ingeschakeld element is geselecteerd en stel de hoofdpositie numeriek in via het tabblad Schuiven van het menu Vulling of sleep de T-vormige handgreep op de pagina om de hoofdpositie in te stellen.
  2. Stel de verticale en horizontale richting en de bijbehorende snelheid ten opzichte van de schuifsnelheid van de pagina in in de sectie Beginbeweging. Hiermee wordt de beweging ingesteld die zal worden uitgevoerd voordat de pagina naar de hoofdpositie wordt geschoven.
  3. Stel de verticale en horizontale richting en de bijbehorende snelheid ten opzichte van de schuifsnelheid van de pagina in in de sectie Eindbeweging. Hiermee wordt de beweging ingesteld die zal worden uitgevoerd nadat de pagina naar de hoofdpositie wordt geschoven.

Opmerking:

In de afbeelding met de scrolleigenschappen is de rechthoek ingesteld op verplaatsing naar rechts met een snelheid van 3 keer de schuifsnelheid van de bezoeker. De rechthoek arriveert op de plaats van bestemming in het ontwerp wanneer de pagina in een browser de hoofdpositie bereikt. Wanneer de bezoeker voorbij de hoofdpositie (100 pixels) schuift, verlaat de rechthoek zijn positie en verplaatst deze zich met een snelheid van 3 keer de schuifsnelheid van de bezoeker naar links. In dit voorbeeld wordt de rechthoek niet verticaal verplaatst, omdat beide verticale velden zijn ingesteld op 0.

  1. Als u het menu Vulling wilt sluiten, klikt u op een willekeurige plaats op de pagina.
  2. Klik op Voorvertoning of kies Bestand > Voorvertoning van pagina weergeven in browser om de scrolleffecten te testen nadat u deze hebt toegepast. Schuif de pagina om de verplaatsing van het element te zien.
  3. Keer terug naar Muse of klik op de knop Ontwerpen wanneer u klaar bent met testen om de pagina verder te bewerken.

Dit werk is gelicentieerd onder de Creative Commons Naamsvermelding/Niet-commercieel/Gelijk delen 3.0 Unported-licentie  De voorwaarden van Creative Commons zijn niet van toepassing op Twitter™- en Facebook-berichten.

Juridische kennisgevingen   |   Online privacybeleid