Gombok a DLE helyszínen
Ezért úgy döntöttünk, hogy adjunk egy példa, gomb fel honlapunkat a motor DLE. Ez nagyon kényelmes a felhasználók számára, hogy képes, mint a felfelé gomb lehetővé teszi, hogy gyorsan mászni a csúcsra az oldal (felfelé) bárhol az oldalon. Különösen ez a funkció fontos a mobil változata a honlapon, ahol a képernyő meglehetősen szűk és az oldal tartalmát is tarthatnak több képernyőn. Ebben az esetben a felhasználónak kell kímélni a mozgalmas képernyő görgetés, azzal a céllal, hogy a menü vagy egyéb ilyen elem, amely a lap tetején. Számára ez teszi a funkcionalitás rejlő gombra.
Továbbá, ez a lehetőség adott webhelyek sok tartalom. Általában a dolog hasznos és kényelmes. By the way, az alapértelmezett sablon, hogy jön ki a dobozból a DLE motor, a gomb. Ez csak azt nem tette jól. Először is, ez valahogy távolítani a mobil oldalon. Másodszor, az asztalon ez a az oldal alján, vagyis ha valahol a közepén az oldal tartalmának, a gomb egyszerűen nem áll rendelkezésünkre.
Szeretném mindegy ez a gomb nem jelenik meg a az oldal alján, és már elérhető a számunkra szinte mindig. És, persze, jó lenne, hogy ez a gomb is rendelkezésre áll egy mobil változata a honlapon. Próbáljunk csinálni.
Én egy meglévő gomb, amely látható a fenti képen, de használhatja a saját gombot, a kívánt módon. Lássuk a gomb kódját a fejlesztői konzol.
Mint látjuk, van egy felső gomb azonosítója, amelyre a megfelelő stílust leírt. Ahhoz gomb mutatja, nem csak a az oldal alján, meg kell, hogy regisztráljon, és adja meg a rögzített pozicionáló megfelelő francia alább. Tesszük ezt a style.css fájlt.
A gomb most elérhető bármely oldalán, mint mi meg fix elhelyezése, és a tér alulról és jobbra 50 pixel neki.
A következő lépés az lesz, hogy bemutassák a gomb csak egy bizonyos helyzetben, például kezdve 200 pixel lapozzunk a lap tetején. Ez kezdetben a gomb nem látható, de miután 200 képpont görgetés, akkor mutasd meg. Ehhez ugyanabban a stílusban, először a gomb elrejtése, hozzátéve, egyszerű szabály display: none;
Most írni egy egyszerű script, amely megjeleníti a gombot, ha az oldal tekercset. Ezt meg lehet tenni egy külön js fájl, ami lehet csatlakoztatni az oldalt. Ön is használja egy meglévő fájlt, vagy regisztráljon a kívánt kódot a sablon. Fogok összpontosítani a legújabb verzió, annál is inkább, a sablon main.tpl már js kódot. Töltse ki a kód:
A lényege a kód elég egyszerű. Amikor görgetés esetén ellenőrizzük a teret felülről, és ha ez nagyobb, mint 200 képpont, akkor megmutatjuk a gombot, különben - elrejteni. Nos, ha rákattint a gombra az animált görgetés fel 700 milliszekundum.
Ez a bal gombot, hogy a rendelkezésre álló mobil eszközök. Tény, hogy a rejtőzködő nem gombot, és a készülék, amelyben található ez a gomb. Ez a blokk osztályú rightside. A legegyszerűbb lehetőség, hogy megoldja a problémát egy egyszerű eltávolítása az osztályból a blokk. Blokkban tárolt modules / footmenu.tpl sablont. Nyisd ki, és elvégzi a szükséges változtatásokat.
Nos, ez minden. Most már a gomb működik az asztali és a mobil eszközök. Ezen már ma. Emlékeztetem Önöket, hogy ha azt akarjuk, hogy többet tudjon meg a DLE, majd megismerjük arány létrehozása honlap CMS DLE. Sok szerencsét!
A legtöbb IT hírek és webfejlesztés A csatorna-távirat