CSS: hover. Original svävareffekter

Radikalt nytt var tanken att dela upp presentationen av information från koden det skapade och bearbetas. Det var en stark beslut i rätt tid, men den här gången kändes inte igen sedan helt. När programmeringen är separerad från en enda dator, men inte vinna i det lokala nätverket eller en enda domän zon och omedelbart spridda överallt, men sedan blev det uppenbart att tillhandahållande av information (i form av design) och arbeta med det (i form av kod) - två sida i samma plan.

Tre aspekter av webbplatsen byggnad

Ur formell synvinkel finns det tre huvudkomponenter (i olika skepnader syntax) som utgör sajten: PHP-kod, JavaScript-kod och beskrivning av CSS-format. Det spelar ingen roll hur det används och vilken version av ett visst ämne, vilken version av HTML som används och vilken version av webbläsaren är värt det. Kompatibel idag inte hålls i hög aktning, eftersom det vid varje given tidpunkt är försenad: som kodas och att vad som kodas kan visas och exekveras.

Om tidigare kämpat för idén om språket, nu kämpa förgäves föredrar tillverkare standarder inom Internet-teknik och webbläsare.

Privat och offentlig

Det sätt på vilket tillgång till Internet, en hel del (datorer, bärbara datorer, tabletter, smartphones), webbläsare, också i överflöd. Det finns ingen garanti för att enskild enhet kommer att visa platsen i den form som den skapades av en utvecklare. Inte alltid nå målet sista ansträngning, och ger en enhetlig webbdesign har många ansikten, det är kärnan i enighet display, överallt där det kan öppnas för besökaren.

Dela den privata och den offentliga, med hjälp av den senare endast vad som fungerar, kan du uppnå betydande framsteg i konstruktionen. Skönhet, konstnärlig stund och webbdesign - arvet av relevanta experter och talanger. CSS - en kod, men mycket märkligt. Hans oro för att beskriva stilar (Visningsalternativ). Med tillkomsten av mobila enheter CSS att ladda faktiska kodning av media frågor. Så att möjligheten att åter äktenskap mellan design och kod - det är inte så orealistiskt som det kan ha verkade bara några år sedan.

Utvecklaren bedriver utveckling CSS-stilar baserade på personliga erfarenheter och beprövade de CSS design som fungerar på de flesta webbläsare tillfredsställa de flesta besökare. den första och andra minimum bör användas så mycket som möjligt, så mycket mer sannolikt att få ett resultat som fungerar i stort sett var som helst, när som helst.

Den första regeln: Standard hopp, utan även de som hjälper sig själva

CSS: hover - när musen är "borta" på objektet sidan. När musen klickar på ett element, blir den aktiv, men när markören går åt sidan, kan det ändras igen, och visa sig i ett aktivt tillstånd. ": Hover", "aktiv" och "besökt" - de mest populära pseudoklasser i beskrivningen av stilar.

Det är mycket bekvämt på din webbplats kod inte oroa sig för sådana bagateller som rörelse musen över elementen. Att ge i tabellen som beskriver två beskrivningar av stilar:

elementet {

färg: svart;

}

elementet: hover {

färg: vit;

background-color: green;

}

Skaffa när du håller musen på elementet automatiskt ändra textfärgen från svart till vitt, och ändra bakgrunden av elementet till grönt. Pseudo kan tillämpas på alla element och uppnå en mängd olika visuella effekter.

Den andra regeln: förtroende standarder styrs av sin kod

Allt skulle vara bra om framsteg kvar på datorer och bärbara datorer utrustade med vapen, och framsteg inom mobil kommunikation har inte lett till uppkomsten av smartphones, surfplattor och andra mobila enheter som ansluter en sådan anordning är mycket problematisk.

Å andra sidan, endast utrustad med en speciell pekskärm gadget är tillgänglig direkt manipulera fingrarna på pekskärmen, eftersom det har blivit vanligt att smartphones, surfplattor och liknande enheter.

Det finns en betydande skillnad och: hover fungerar här är inte som vi skulle vilja. Ingen kod inte kan göra, och användningen av mediafrågor beslutar att inte alla frågor.

Kompatibilitet - för dyrt i dagens värld av information, därför att säkerställa korrekt funktionalitet på webbplatsen inom de specificerade krav för webbdesign och genomförande av en funktionell, helst styrs av minimi nödvändiga användningsfall: CSS hover, CSS hover fokus, CSS hover aktiv (besökt) . Ju mer kod (som i webbläsaren och på servern) övervakar webbdesign, desto bättre. Programmet - är kontrollen, det är bättre när denna kontroll är inte att hyra på händerna på gällande standarder, som ofta inte vet vad som väntar.

Knappar och andra delar av sidan

Button hover CSS - en underbar lösning, men i det långa loppet, är varje sida elementet "knapp". Webbplatsen måste i första hand vara en levande och om koden inte är byggd, om uppgiften är att skapa en webbplats som utvecklar tillräcklig omfattning och handlingar som bygger på besökarnas beteende, så åtminstone med hjälp av CSS-stilar kan ge livlighet sidelement.

Använd hover effekter bekvämt. Med deras hjälp kan du enkelt ge dina sidor livlighet, men koden inte vet vad som gör en mus på skärmen, om det inte är möjligt att spåra dess rörelse. Ur denna synvinkel, det vill säga, när koden styr musrörelse (= rörelse av ett finger på en smartphone) kan det oberoende markera ett objekt eller att konvertera den. Det har ingenting att göra med pseudoklasser, men ger full kontroll över teckentabellen utseende, på ett tillfredsställande sätt visa den på olika enheter i olika webbläsare.

Fallgropar i mallar

Att säga att standarden när det gäller CSS stilar inte vet vad de gör, är det omöjligt, men att säga att de fullt ut samarbeta med andra standarder inom internetprogrammering är också omöjligt.

Stilar och pseudoklasser kan beskrivas i det skede av sidan kodning, när servern genererar en sida och dynamiken är redan inne i webbläsaren kan du enkelt skapa en ny stil och ändra en befintlig.

Med hjälp av AJAX, när det inte finns något behov av att återskapa på sidan för att visa svaret på inverkan av besökare, och det är tillräckligt för att ändra ett objekt eller flera objekt lägger till en liten "peppar". "Vänskap" code - som redan finns i webbläsaren (JavaScript) och det faktum att servern (PHP) - arvet från författaren (programmerare) webbplats.

Om hur algoritmen för denna interaktion kommer att utföras, beror i hög grad inte bara på displayen på sidan av dess delar, men också deras uppfattning om ytterligare kod. Enkelt uttryckt, pseudo (i synnerhet) är mycket bra för statisk, som för segelbåtar i det kristallklara havet med en lätt bris - allt är klart, tillgänglig och hanterbar. Om väderomslag eller när vinden är starkare, eller kommer att orsaka besökaren en oväntad situation, kan du snabbt ned på revet och förlora besökaren.

Standard och dess emulering

Styla CSS hover kan emuleras via JavaScript, genom att använda onMouseOver och onmouseout händelser. Ofta alla ändar. Ur sunt förnuft när det gäller att skapa verklig arbetsplats, är det bättre att behålla kontrollen i sina händer, än att ge den i händerna på de mytiska standarder som förändringen är vilja och önskan utvecklaren.

Ibland kan du läsa något i stil med "det här funktionen finns även i IE», men mer kan läsa om vad stilar uppfattas beskriva en specifik webbläsare. Mycket mindre kan läsa om hur JavaScript är olika i olika webbläsare.

Utvärdering av erfarenhet, beundra funktioner "Chrome" och "Opera", kritiserade långsamhet och tröghet i webbläsaren från tillverkaren (av den oförglömliga, kära till hjärtat av varje programmerare IE, "Microsoft", "den gamla goda Internet Explorer inte förbannade bara lata. Eller vem på datorn bara vet hur man spelar "Solitaire", "- citerade en okänd författare Internet), bör följa den gyllene medelvägen: använd det som fungerar överallt och hela tiden.

Människor behöver verktyg för att arbeta när de behöver för att få spänning, de brukar gå till magistraten eller teater, men inte Internet.

Emulation och kontroll

Tidigare, när programmeringen blir på fötter, var det brukligt att lyssna på seniorer och skriva korrekt. Idag för många pensionärer, för snabbt allt förändras, och om du vill lyssna på hela tiden räcker inte ens för en mycket enkel uppgift, vid den minsta funktionella platsen.

Programmering - är i första hand en kontroll, och i de fall då vanliga partiska fastställer reglerna, eller så kan du räkna med en kraftig förändring av reglerna, likvidation och framväxten av den nya, har den bästa lösningen alltid varit att inte göra några beslut och genomföra den nödvändiga platsen funktionalitet minsta möjliga, men verkligen arbetar kod .