Înainte de a începe o lecție despre crearea de rollovers, hai să vedem ce este rolloverul.
Uită-te la imagine, ce vezi pe ea?
Corect, o inscripție obișnuită și acum încercați să plasați cursorul mouse-ului peste imagine. Ce sa întâmplat? Imaginea și-a schimbat aspectul. el a reacționat la acțiunile utilizatorului. Deci, se pare că un rollover este un desen care își schimbă aspectul atunci când plasați mouse-ul pe mouse? Nu exact, uita-te la inscripția de mai jos:
"Acesta este, de asemenea, un rollover!"
Se pare că un rollover este un element al unei pagini Web care își schimbă aspectul atunci când plasați mouse-ul peste mouse-ul? Trebuie să vă dezamăgesc - această definiție nu este, de asemenea, adevărată. Uită-te la inscripția de mai jos.
"Sunt și un rollover"
Din inscripția rezultă că aceasta este de asemenea o răsturnare, dar când plasați cursorul mouse-ului, el nu reacționează la el deloc. Acum încercați să faceți clic pe inscripția cu mouse-ul, ce sa întâmplat? Un cadru roșu apare în jurul inscripției. Chiar dacă acum eliminați cursorul mouse-ului de pe inscripție, acesta nu ia forma originală. Pentru a readuce inscripția la starea inițială, trebuie să facem un al doilea clic pe rollover. Din toate cele de mai sus, concluzionăm că răsturnarea poate reacționa nu numai la mișcarea mouse-ului, ci și la un clic al mouse-ului.
Deci, care este rolloverul? Rolloverul este un element al unei pagini Web care își modifică funcția externă în funcție de impactul extern.
De regulă, în practică, rolloverul reacționează la mișcarea mouse-ului. Acesta este un fel de rollover pe care vom încerca să-l creăm în această lecție. Ca stare inițială a răsturnării, folosim un desen mic (vezi mai jos), care va acționa ca un buton de navigare.
Pe măsură ce conduceți, imaginea arată o pisică, dacă nu mă înșel să fiu Jerry, dar nu este absolut important. Cel mai important lucru este să salvați acest desen sub ce nume. Dacă intenționați să plasați site-ul dvs. pe Internetul global, trebuie să atribuiți un nume imaginii format din caractere latine în litere mici. Faptul este că în caz contrar este posibil să aveți probleme cu plasarea fișierelor pe serverul de găzduire. Deci, salvez desenul original ca cat_up, rețineți că numele fișierului are o încărcare semantică și că nu există spațiu în el. Utilizați un spațiu în numele fișierelor nu poate, din motivul de mai sus.
A doua imagine (a se vedea imaginea de mai jos) diferă de cea de-a doua numai în fundalul mai deschis al imaginii, obiectivul nostru fiind acela de a obține efectul evidențierii imaginii când se deplasează mouse-ul.
După ce ambele imagini sunt gata și integrate în site-ul nostru, puteți începe să lucrați.
Plasați desenul original oriunde pe pagina Web și selectați-l cu mătasea butonului stâng al mouse-ului. Apoi, în meniul "Format", selectați elementul "E-mail Effect Dynamics", apoi panoul corespunzător (dacă acesta nu a fost pornit mai devreme) constând din trei meniuri derulante va apărea pe ecran.
Folosind mouse-ul, în primul meniu derulant, selectați evenimentul la care va răspunde rolloverul nostru. Așa cum am stabilit deja, acest eveniment va fi plasarea cursorului mouse-ului peste imagine, așa că selectăm elementul "Mouse move".
În cel de-al doilea meniu derulant, selectăm efectul care va apărea atunci când mouse-ul este plutind peste rollover. În principiu, în acest caz, și alegem să nu avem nimic pentru că. un singur element "Modificați fotografiile". Bineînțeles, o selectăm făcând clic pe mouse.
În cel de-al treilea meniu derulant, nu mai avem o alternativă și alegem elementul unic "Selectarea unei imagini". După ce se deschide fereastra pentru selectarea unei imagini, găsim fișierul numit cat_over și facem o fanta dublă a mouse-ului.
Fă-o singur. În această lecție, am descris crearea unui rollover bazat pe un desen. Pe cont propriu, încercați să faceți o răsturnare bazată pe fragmentul de text, utilizând exemplele de mai sus ca eșantion.
Dacă aveți întrebări, le puteți întreba pe forum. Lăsați-vă comentariile și sugestiile dvs. pe lecțiile din FrontPage să plece în cartea de oaspeți.
Articole similare
Trimiteți-le prietenilor: