Hogyan készítsünk egy spoiler jquery legegyszerűbb lehetőség
Ma meg fogom mutatni a végrehajtás a légterelő jquery - nagyon, nagyon egyszerű, így képes lesz arra, hogy ismételje meg mindent, mindössze néhány perc alatt.
Hello. Ahhoz, hogy következetesen nem a google hogyan kell csinálni jQuery spoiler, úgy döntött, hogy írjon egy cikket egy időben. Különösen azért, mert egyes lehetőségek találtam túl nehézkes, én ajánlani egy nagyon kompakt verzió, csak egy pár sort. Ennek megfelelően, rájössz, hogy lehet hihetetlenül egyszerű és gyors.
Mire van szükség?
Csak könyvtár jQuery, szeretne csatlakozni az oldalra. Ha van egy oldal a WordPress, akkor a funkciók a kapcsolat írtam ide.
Az általunk forgalmazott spoiler
Minden lesz, mint 2 ujjal az aszfalton. Azt feltételezzük, hogy már csatlakoztatva a jquery, akkor hol szeretné megjeleníteni a spoiler, illessze be a következő kódot:
Természetesen a gomb szövegét, és módosítsa a tartalom is magától. Felveheti további css osztályokat olyan elemeket hozzáadni. stilizáció. Most adom hozzá a style.css az alábbi kódot:
Először is, ő stilizálhatja gombot. Másodszor, akkor távolítsa el a légterelő az oldalról. Itt a kulcs:
Alatta, mint látható, nincs semmi. Most a legfontosabb -, hogy ha rákattint a gombra, hogy nyissa ki a spoiler és a fordított klikk - zárt. Ez így van, mert az emberek azt szeretné, hogy zárja be a spoiler, és ha nem adnak neki, hogy nem így van, lehet, hogy nagyon ideges.
Így az összes mágikus fut a kód (ha be közvetlenül a html, valami ilyesmi):
Ha azt szeretnénk, hogy illessze be a kódot a js-fájlt, akkor természetesen, távolítsa el a script tag az elején és a végén.
Fontos, hogy a forgatókönyvet, vagy a script fájlt csatlakozik a helyszínen később jquery. Ha ez nem történik meg, akkor semmi sem fog működni! JQuery könyvtár kell tölteni, mielőtt a forgatókönyvet.
Így tettem:
Azaz, nekem, mint látható, az első kapcsolat van a könyvtár, majd futtatja a forgatókönyvet is.
ellenőrizze eredmény
Itt mi történt:
Ha lenyomjuk történik elhalványul tartalmat. Ismételt kattintás - feloldódnak. Tehát csak úgy, barátok. Ez volt a kiviteli alak egy egyszerű jQuery-légterelő.
By the way, én nem használja ezt a lehetőséget, de csak azért, hogy tegye az összes oldalak wordpress adaptív téma Root. Ő gyönyörű és van már megvalósult a spoilerek, miért adhatok is a plusz kódot?
Érdekes a világ helyszíni építési
Ön előfizetett. És köszönöm.