Een rollover knop is een knop op de website dat zijn toestand verandert als de muis er overheen . De staat verandering kan elk aantal wijzigingen , waaronder kleur , lettertype , grootte of een combinatie hiervan zijn. Rollover knoppen toevoegen polish en professionaliteit om uw website en kan gemakkelijk worden gemaakt in Adobe Photoshop en ImageReady . Deze stappen detail hoe u een eenvoudige rollover knop te maken , maar het proces kan worden aangepast voor meer gestileerde graphics . Wat je nodig hebt Adobe Photoshop ImageReady Toon Meer Aanwijzingen Maak de knop Afbeeldingen in Photoshop 1 Ga naar > Nieuwe en stel het bestand beeldgrootte tot 80 van 25 pixels met een resolutie van 72 pixels per inch . Klik 2 op de voorgrond kleurstaal buurt van de onderkant van het gereedschap palet aan de rechterkant van uw scherm . Selecteer een kleur voor de tekst op uw knop . Klik vervolgens op de achtergrond staal en selecteer een kleur . Druk " 3 " Control + Backspace om de afbeelding met de gekozen achtergrondkleur te vullen . 4 Selecteer het gereedschap "Type " van het palet , en het lettertype en de grootte in het menu gereedschap aan de bovenkant van je scherm . Klik op het document gebied en typ de naam van de knop , zoals " Portfolio " of " Thuis ". 5 Gebruik de functie " Verplaatsen " om de tekst af te stemmen op uw wensen . < Br > Copy 6 zowel de achtergrond als tekstlaag . Maak een kopie van een laag door met de rechtermuisknop te klikken op een laag in het lagenpalet en te kiezen voor " Dupliceren . " 7 samenvoegen van de oorspronkelijke achtergrond en de tekst lagen door het houden van de "Shift" toets ingedrukt en klik beide lagen in het palet Lagen . Ga dan naar > Samenvoegen Lagen bewerken . Hernoem de laag "Normal State . " 8 Dubbelklik op de afbeelding "T " aan de linkerkant van de gekopieerde tekstlaag om de tekst te markeren . Klik op de kleurstaal in het menu gereedschap aan de bovenkant van het scherm , en kies een andere kleur voor de tekst als de muis over de knop . 9 Verander de kleur van de achtergrond laag , indien gewenst . 10 samenvoegen van de twee gekopieerde lagen , en hernoem de laag " Rollover State . " De " Normal State " laag op de bodem en de " Rollover State " laag bovenop : uw bestand moet nu twee lagen bevat . U kunt een voorbeeld van hoe de knop verandering zal kijken door het draaien van de zichtbaarheid van de bovenste laag aan en uit . Klik op het oog grafische links van de laag aan te tonen of te verbergen . Maak de Rollover Button in ImageReady 11 Klik op de " Ga naar ImageReady " knop . aan de onderkant van het gereedschap palet met uw knoop bestand nog open 12 Ga naar het uiterlijk palet ( in CS of nieuwer ) of de rollover palet ( in oudere versies ) , maar als het niet is geopend, gaat u naar het menu Venster en selecteer het palet uit het drop - down menu 13 Verberg de " Rollover State ' laag; . dit zal de normale toestand als de knop instellen op de " normale " layer . 14 Klik op de "Create New State " icoon aan de onderkant van de " Appearance " of " Rollover " palet. Schakel de zichtbaarheid op de " Rollover State" laag om deze in te stellen als de rollover staat 15 Ga naar de slice palet ; . Als dit nog niet is geopend , kan worden gevonden in het venster menu . Wijs een URL naar je rollover knop , dit is de webpagina van de gebruiker zal worden genomen om als hij op je knop klikt Test 16 uw rollover knop door op de " Voorbeeld in standaardbrowser " knop . in de buurt van de onderkant van het gereedschap palet . 17 Ga naar File > Save Geoptimaliseerd voor het HTML-bestand en de map met afbeeldingen op te slaan.
|