Hoe te breiden & ineenstorting tekst op een webpagina

Hoe te breiden & ineenstorting tekst op een webpagina


Er zijn vele momenten waarop een webdesigner moet uitvouwen en samenvouwen van tekst op een website. Deze functie is vooral nuttig wanneer het gaat om het opzetten van FAQs, organiseren van blogberichten en het creëren van raadsel en quiz functies. Deze Java-code in uw website om samenvouwbare tekst invoegen.

Instructies

1

Open de HTML-code van de webpagina die u wilt toevoegen van de samengevouwen tekst. Ga naar de < head > en < / head > tags. Tussen hen, kopieer en plak de volgende code:

< script language = "JavaScript" type = "text/javascript" >
<!--copyright 2005, Sandeep Gangadharan-->
<!--voor meer gratis scripts Ga naar http://www.sivamdesign.com/scripts/ ->
<!--
Als (document.getElementById) {}
document.writeln ('< stijl type = "text/css" ><!--')
document.writeln ('.texter {display: none} @media {.texter {display: block;}} afdrukken ')
document.writeln ('/ /--> </style > ")}

functie openClose(theID) {}
Als (document.getElementById (theID).style.display == "blokkeren") {document.getElementById (theID).style.display = "geen"}
anders {document.getElementById (theID).style.display = "blokkeren"}}
-->
< / script >

2

Ga naar de sectie van de < body > waar uw samenvouwbare tekst moet gaan. Plak de volgende code er, vervangen door de tekst aan uw behoeften.

< div onClick="openClose('a1')" stijl = "cursor: hand; cursor: aanwijzer">< b > 1] punt 1: < /b >< / div >
< div id = "a1" class = "texter" >
Punt 1 tekst. < br / >< br / >
< / div >

< div onClick="openClose('a2')" stijl = "cursor: hand; cursor: aanwijzer">< b.2 >] punt 2: < /b >< / div >
< div id = "a2" class = "texter" >
Punt 2 tekst. < br / >< br / >
< / div >

< div onClick="openClose('a3')" stijl = "cursor: hand; cursor: aanwijzer">< b > 3] punt 3: < /b >< / div >
< div id = "a3" class = "texter" >
Punt 3 tekst. < br / >< br / >
< / div >

3

Als u extra items moet, doorgaan met het patroon, met behulp van ('a4') en "a4", ('a5') en "a5", ('a6') en "a6", enzovoort. Sla het bestand op en testen van uw code om ervoor te zorgen dat het goed functioneert. U moet zitten kundig voor Klik op een titel te brengen van verborgen tekst en vervolgens laten verdwijnen.