"Opp" -knappen for nettstedet: hvordan du gjør det

En slik funksjon, som "opp" -knappen for et nettsted, gjør en Internett ressurs mer praktisk for sine besøkende. Det hjelper deg enkelt å flytte fra hvor som helst på siden til toppen. Dette er bare nødvendig for nettbutikker og nettsteder med store artikler som krever en lang rulle nedover.

Hva er det for?

For øyeblikket er det ikke slik funksjon på de fleste nettsteder som "opp" -knappen, og det er ikke noe kritisk om dette. Men bruken kan gi mange plusser både for Internett-ressursen og for sine besøkende.

Fordeler for besøkende

Det skjer ofte når nettsiden til en Internett-ressurs er tungt lastet med informasjon, når en informasjonsartikkel tar opp mye plass og du må rulle nedover siden med museskiven. I tillegg til dette, i slutten av artikkelen kan det være mange kommentarer til det.

Når en besøkende leser en artikkel, er det ikke noe kjedelig å bla nedover siden, men når teksten er ferdig, og det er nødvendig å bevege seg oppover, begynner det å trette litt. De fleste vil rett og slett være for lat til å lede en lang rulle, og de vil bare lukke stedet, i stedet for fortsatt å rusle gjennom sine ekspansjoner.

Ved å bruke knappen for å flytte direkte til toppen av siden, gjør tidsfordriv på nettstedet mer praktisk.

Fordeler for en Internett ressurs

De positive sidene for selve ressursen er basert på tidligere faktorer, fordi en forenklet bevegelse på nettstedet forbedrer atferdsfaktorer, da alle besøkende vil være mer aktive i sine handlinger og flytte til andre sider.

Dermed påvirker disse atferdsfaktorene holdningen til alle søkemotorer til nettstedet og fører til en forbedring av plasseringen av søkeresultatene.

Hvordan lage knappen "opp" på nettstedet selv

Vi forstår videre. Oppringningsknappen for et nettsted på et av CMS kan alltid gjøres selv, bare noen få svært enkle trinn:

• Bildeopprettelse;
• Skaper et skript;
• Opprette en knappestil;
• Legge til nettstedet.

Knappbilde

For å legge til "opp" -knappen på nettstedet, må du først lage ikonet ved å klikke på hvilken brukeren vil flytte opp siden. For å gjøre dette kan du bruke ferdige alternativer, blant annet kan du alltid velge den mest egnede.

For å forbedre utseendet på knappen, er det nødvendig å gjøre noen forbedringer, nemlig å lage en sprite, som lar deg kombinere bakgrunnsbilder på grunnlag av CSS, og dermed skape en animasjon fra dem.

For grafiske verk kan du bruke noen redigeringsverktøy. Men det mest praktiske alternativet vil være online-tjenesten PIXLR, da det ikke er noe å laste ned her, og du kan bruke det direkte i nettleseren.

For å begynne å jobbe i redigeringsvinduet som vises, velg feltet "Last opp bilde fra datamaskin". Som et eksempel, ta bildet av raketten.

Hvis dimensjonene til det valgte ikonet er for store, vil det være nødvendig med en liten justering av dimensjonene. For å gjøre dette, gå til toppmenyen og velg "Rediger" -feltet, og etter "Free transform ..."

Videre ved siden av bildet er det spesielle markører, som beveger dem, kan du endre størrelsen på bildet. For å lagre proporsjonene, kan du bruke Shift-tasten, som, hold, må du flytte de blå markørene. På slutten av disse handlingene blir bildet av raketten oppnådd.

Det neste trinnet er å lage en kopi av laget.

Nå må du flytte rakettbildet fra det nye laget litt opp. For å gjøre dette vil det være praktisk å bruke flytteverktøyet, som ligger i den andre kolonnen i venstre meny, og pilen "opp" på tastaturet.

Nå må du gjøre toppbildet i svart og hvitt. Dette kan gjøres ved å bruke "Rettelse" - "Hue / Metning" -elementet i toppmenyen. For fullstendig avfarging må glidebryteren Saturation være satt til -100. Denne handlingen gir deg mulighet til å gjøre en effekt når "Opp" -knappen blir svarte og hvite til farge når du svever den.

Den endelige berøringen er å fjerne overflødig plass rundt de to bildene. For å gjøre dette, velg "Crop" -elementet fra venstre meny og velg bare to raketter i rektangelet. For å utføre beskjæringen, trykk Enter-tasten.

Resultatet er et bilde der det ikke er overskytende plass. Det vil være nødvendig å registrere bredden og høyden til det resulterende bildet, siden disse dataene vil være nyttige i neste trinn.

For å lagre, må du klikke på "File" - "Save", der i venstre element "Min datamaskin" skriver navnet på bildet (kun engelsk layout), velg formatet (i dette tilfellet - PNG) og klikk "Ja" -knappen.

Fil med "opp" -knappen

I dette tilfellet trenger du ikke skrive et skript. Det vil være mulig å dra nytte av det offentlige alternativet, noe som gjør noen rettelser i den ferdige koden.

For å gjøre dette, må du laste ned noen kodeditor. Den mest populære og gratis versjonen er Notepad ++. Etter at du har installert det, må du kopiere og lime inn i alt denne koden: