Pop-up ablak alján az oldal design és weboldal fejlesztés

Jó napot 🙂

Először egy egyszerű pop-up ablak késéssel az oldal betöltésekor. Egy példa arra, amit el kell jutnunk, hogy néz az alábbiakban.

Először adja hozzá a HTML kódot az ablakot. Minden egyszerű. A központi egység a ablak id = „msg_pop”. és gombbal záródik class = „msg_close”.

Ami a jövőt illeti, azt fogja mondani, hogy ez lehetséges, hogy egy ablakot minden elemet - egy linket, span, div, és így tovább. Azaz, ha nem kell futtatni egy ablak automatikusan késéssel, vagyis ha rákattint egy gombra vagy linkre, és így tovább. akkor meg kell, hogy kihagyja azt a lépést, hozzátéve a forgatókönyvet, hanem azt az elemet, ha rákattintunk, az okozta az ablakon - is hozzá egy eseményt onclick.

És így, mint például, mi lesz egy gomb - a szokásos span. Meg kell, hogy a tételt, és hogy ugyanazt a kalibráló és adjuk hozzá a rendezvény, az eredmény az lesz, valahogy így:

Most, adjunk hozzá egy script, hogy nyissa ki az ablakot. Ha úgy dönt, hogy fut egy ablak, egy gomb, a fent leírtak szerint, majd hagyja ki ezt a lépést.

A fejlécben vagy a pincében, nem különösebben fontos, lehet mellett egy ablak hozzáadásával itt van egy kis script.

És az utolsó lépés - ez a stílus az ablakon. A festék a részlet, amely felelős a mi nem. Ismerje CSS. Ez egyszerű, könnyű és nagyon hasznos, ha Ön úgy döntött, hogy vegyenek részt a vebmasterstvom. A stílus egyszerű, ha ismeri a CSS.

Hadd mondjam el, hogy három fő lehetőséget. Az első a beállításokat a géptest Haydee - msg_pop.Tut legfőbb feltétele - display: none;

További lehetőségek a közeli gomb - msg_close. És végül, ez egy osztály és ingatlan fadeIn @keyframes - létrehozni animációk.

Azt fogja mondani, még egy fontos! dolog. A tulajdonságok egy paraméter animáció animáció-időtartama: 0.4s; és az egyik klón króm. Ez az animáció. Mint látható, ez már nem a késleltetés ablakot. Ha növeli a késleltetési idő, akkor kell játszani körül az idő és animáció, és a megjelenítés. Ellenkező esetben az animáció vége előtt, majd az ablak jelenik meg.

Ha úgy dönt, hogy az ablak csak egyszer jelenik meg egy nap, például, vagy óránként egyszer, akkor csináld így. Azt kell mondanom, hogy már használja - jQuery.

Megjeleníteni, naponta egyszer kell elvégezni egy sütit. Stílusok és ablakok kód változatlan marad. A JavaScript helyett meg kell adni egy másik forgatókönyvet. Egy példa arra, mi történik láthatjuk az alábbi példát.

A kezdéshez meg kell csatlakoztatni a könyvtár - jQuery. Ha ezt megelőzően vagy azt teszi a motor a helyén, akkor nem kell csinálni. Be kell kapcsolódni a fejléc vagy lábléc.

Ezután csatlakoztassa a fájl felelős a kialakulását a cookie-t. A fájl letöltése szükséges - jquery.cookie.js

Csatlakoztassa a cookie fájlok adja meg a mappa elérési útját, miután a könyvtár, ahol van elhelyezve úgy, ha ugyanabba a mappába, ahol a fájl HTML, egyszerűen a nevét.

Itt valójában nem is egy csomó lehetőséget. Mintegy Haydee nevek és osztályok, azt hiszem, világos, hogy hol a változás esetén meg kell változtatni itt.

A 3. sor mutatja az időt a cookie akció. Ez megegyezik a hossza az ülés. Ha meg akarjuk változtatni, akkor olvassa el a cikket - A pop-up ablak jelenik meg időeltolódással az oldal betöltésekor. Van egy olyan kijelentés ebben a tekintetben. Újra elmondjam nem látja értelmét.

Ez minden, amire szükség van, hogy a második változat a cookie-kat. Próbálja meg, kísérletet, és a kívánt eredményt.

Ez minden, köszönöm a figyelmet. 🙂

Ha hasznos volt a munkámhoz, támogatni tudja a helyszínen :)

Helló csak meg kell adni a kiinduló lejátszást.
$ ( "„) .attr ( 'src': '123.mp3',
'Volume': 0,4,
„Automatikus lejátszás”: „automatikus lejátszás”
>) AppendTo ( "test") .;
Ebben a kódot, hozzá egy hangfájlt 123.mp3 az oldalra. Ahhoz, hogy meg kell adni a megfelelő elérési útját és nevét.
'Volume': 0.4, - 0.4 hang maximális hangerőre. és „automatikus lejátszás”: „automatikus lejátszás” - automatikus lejátszás.
Ezt a kódot kell hozzáadni egy meglévő script, ezt kapod:
jQuery (dokumentum) .ready (function ($) $ ( "# msg_close") click (function () $ .cookie ( "msg_pop", "",) .;
$ ( "# Msg_pop") hide () .;
>);
if ($ .cookie ( "msg_pop") == null) setTimeout (function () $ ( "# msg_pop") addClass ( "fadeIn") .;
$ ( "# Msg_pop") show () .;
$ ( "„) .attr ( 'src': '123.mp3',
'Volume': 0,4,
„Automatikus lejátszás”: „automatikus lejátszás”
>) AppendTo ( "test") .;

Szia kedves barátom

Van AdBlock telepített bővítmény vagy hasonlók. Add oldalamon a fehér listát, és így vnesesh hozzájárulnak kialakulásához. Arról, hogy hogyan tiltsa AdBlock szeretné ezt az ablakot