Slēptu teksta bloku ievietošana uzlabo vietnes lapas vizuālo uztveri - tā pārlūkprogrammā tiek ielādēta tieši tā, kā dizainers to ir izstrādājis, neatkarīgi no ievietotās informācijas daudzuma. Turklāt apmeklētājam tas ir ērtāk - meklējot nepieciešamo informācijas bloku, viņam nav jāpārskata viss masīvs, bet gan tikai mazi "aisbergu gali".
Tas ir nepieciešams
Pamatzināšanas par HTML un JavaScript
Instrukcijas
1. solis
Izmantojiet pielāgotu JavaScript funkciju, lai paslēptu un parādītu vēlamos teksta blokus HTML lapā. Visu bloku kopējā funkcija ir daudz ērtāka nekā koda pievienošana katram no tiem atsevišķi. Lapas avota koda galvenes daļā ievietojiet sākuma un aizverošā skripta tagus un starp tiem izveidojiet tukšu funkciju ar nosaukumu, piemēram, swap un vienu nepieciešamo ievades parametra id: function swap (id) {}
2. solis
Funkcijas pamattekstā starp cirtainajām lencēm pievienojiet divas JavaScript koda rindiņas. Pirmajā rindiņā ir jālasa teksta bloka pašreizējais stāvoklis - neatkarīgi no tā, vai tā redzamība ir ieslēgta vai izslēgta. Šādus blokus dokumentā var būt vairāki, tāpēc katram jābūt savam identifikatoram - tā ir viņa funkcija, kas saņem id kā vienīgo ievades parametru. Izmantojot šo identifikatoru, tā meklē nepieciešamo bloku dokumentā, piešķirot redzamības / neredzamības vērtību (displeja rekvizīta stāvokli) mainīgajam sDisplay: sDisplay = document.getElementById (id).style.display;
3. solis
Otrajā rindiņā vajadzīgā teksta bloka displeja rekvizīts jāmaina pretējam - paslēpiet, ja teksts ir redzams, un parādiet, vai tas ir paslēpts. To var izdarīt ar šādu kodu: document.getElementById (id).style.display = sDisplay == 'neviens'? ':: "neviens";
4. solis
Pievienojiet galvenes sadaļai šādu stila lapu: a {cursor: pointer} Tas būs nepieciešams, lai peles rādītājs tiktu parādīts pareizi, kad virzāt kursoru virs nepilnīgas saites taga. Izmantojot šādas saites, jūs lapā kārtojat, lai pārslēgtu teksta bloku redzamību / neredzamību.
5. solis
Novietojiet šīs pārslēgšanas saites tekstā pirms katra slēptā bloka un teksta beigās esošajos blokos pievienojiet līdzīgu saiti. Ietveriet neredzamo tekstu laiduma tagos, kuru stila atribūtos ir iestatīta neredzamība. Piemēram: Paplašināt tekstu +++ Tas ir slēptais teksts --- Šajā piemērā noklikšķinot uz saites trīs plus, notikums onClick izsauks iepriekš minēto funkciju, nododot to redzamā bloka ID. Un bloka iekšpusē ir saite ar trim mīnusiem ar vienādām funkcijām - noklikšķinot uz tā, teksts tiks paslēpts.
6. solis
Izveidojiet vajadzīgo teksta bloku skaitu, līdzīgu tam, kas aprakstīts iepriekšējā darbībā, atceroties mainīt ID ID span atribūta id atribūtā un mainīgajā, kuru divās saitēs notikumam onClick nodeva funkcija.
