Anchor și o tranziție lină pentru legături de ancorare, proiectarea si dezvoltarea site-ului

Bună ziua. 🙂

Ceva ce nu am lucrat, și a scris articole. Ei bine, să fie corectată. Recent, unul dintre articole, unul dintre vizitatori care au părăsit întrebarea, care se ocupa cu legături de ancorare. Am promis că în curând voi scrie un articol despre ei.

Și astfel, să ne spui de la bun început că o legătură ancora sau doar ancora. Link-uri ancorate - un link care muta vizitatorul într-o anumită locație pe pagină. În esența sa, este ca un semn de carte. Dacă pagina are un volum mare și este, în esență, împărțit în diferite blocuri, puteți face astfel încât vizitatorul poate merge direct la partea dorită a paginii fără a utiliza derularea.

Un exemplu de activitatea unor astfel de legături pot fi găsite pe această pagină:

Pentru a începe, trebuie doar să creați un link în loc de calea și specificați o ancoră și un semn de lire în fața ei - #

Va ancora blocul cu ID-ul - # YAK1. Apoi, pur și simplu prescrie elementul dorit cu Haydee dreapta.

În cazul nostru - este un bloc div simplu. De fapt, pentru o tranziție simplă, care e tot. Făcând clic pe un astfel de link-ul, vizitatorul va transfera imediat la o parte a paginii, care este blocul de ancorare.

Pentru a realiza mișcarea lină a ancorelor, trebuie să conectați - jQuery. După ce am fost în căutarea pentru script-ul din dreapta și scotoci printr-o grămadă de informații. În mai mult de jumătate din spectacol script-uri care pur și simplu nu funcționează pe noua versiune a bibliotecii. Puteți găsi, de asemenea, aceste scripturi, înainte de a ajunge la site-ul meu. Apoi am primit scenariul, care a fost o soluție pentru problemele mele.

Pentru un început înainte de capacul de închidere sau cap la subsol, înainte de zakryvayuschimsyabody au nevoie pentru a conecta biblioteca jQuery.

Asigurați-vă că nu a făcut deja acest lucru, pentru a nu provoca conflicte și script-ul non-funcțional.

Acum, după biblioteca, conectați script-ul, care va oferi o animație tranziție lină.

Cea de a șasea linie conține numărul 1500 - timpul în milisecunde și este egală cu 1,5 secunde. Acesta este momentul pentru care se face trecerea de la ancora dorită. Pentru a accelera sau încetini animație, pur și simplu schimba numărul.

Asta e tot, vă mulțumesc pentru atenție. 🙂

Dacă ați fost utile pentru munca mea, vă poate sprijini site-ul dvs. :)

Compania electrică principală, astfel încât