Kép átméretezés jQuery
Jó napot, szeretnék ajánlani egy viszonylag egyszerű, de nem kevésbé látványos tanulság átméretezés képek egy csúszka (slider). Kezdeni lássuk, mit kell foglalkoznunk.
Az első dolog, amit meg kell kezdeni ezzel kapcsolatban JQuery, swing itt.
A második lépés az, hogy csatlakoztassa jQuery UI - egy nagyon hasznos kiegészítő JQuery, ebben az esetben van szükség, egy widget csúszka. Akkor itt letöltheti. ami a legfontosabb ne felejtsük el, hogy távolítsa el a (összes kijelölés törlése). Az összes többi négyzeteket kivéve Slider és UI Core, különben fennáll a veszélye egy hatalmas és haszontalan (ez a bemutató) fájlt.
Az archív tartalmazza az összes szükséges, de még mindig azt ajánlom teszt használja az archívumot, amely a már elvégzett munkát tisztítását a felesleges stílusok és más demonstratív fájlokat.
HTML a legegyszerűbb mi dokumentumot.
Két bemenet az űrlap elem, amely megjelenik a adatsebesség a kép, vagy még inkább a szélessége és magassága:
Tulajdonképpen a csúszka (vagy a csúszka, amit szeretnék)
És persze a kép, amelyen dolgozunk (a tényleges képméret 666 x 1000 px)
Figyelem! Ha hozzá képeket feltétlenül szükséges előírni azt szélesség és magasság attribútumokat.
Most JQuery:
Nézzük sorrendben fogja érteni, amit tettünk:
- alkalmazásával attr () paranccsal megkapjuk az értéke az attribútumok a kép szélességét és magasságát, és hozzárendelheti azokat a megfelelő változókat.
- Mi határozza meg a képarányt a kép - a szélesség és magasság. Ez segít nekünk, hogy helyesen proportsionirovat meg az oldalon.
nyakkendő csúszka Widget HTML-jelölést, pontosabban a mi
- testreszabható csúszka alatt a követeléseinket:
orientáció - a helyzet az oldalon, lehet, hogy a két érték „horizontális” és „vertikális”
min és max - minimum és maximum értékek a skála (bármelyiket megadhatja, a tényleges felhasználás a helyszínen azt ajánlom, hogy köti őt a maximális mérete képek)
érték - meghatározza a kezdeti helyzetben a csúszka, rendeljen értéket a változó szélességű (és általában ez lehet bármilyen számértéket belül min és max)
- eseményeket, amelyek reagál csúszka
- mivel ui.value - aktuális értéket érték lehetőségeket, és azt fel kell szerelni a jellemző szélessége (a kép szélessége), hogy határozza meg a magasságot, meg kell, hogy végezzen egyszerű számtani osztani az aktuális értéket widht Z, amely emlékezni fogsz a képarány a kép. És a kapott értéket kerekíteni segítségével Math.round funkciót.
- val () parancs eléréséhez használt értékek az űrlap elemek.
- akkor a legfontosabb, módosítsa a szélessége és magassága a kép közvetlenül az oldalon segítségével csapatok szélesség () és a magasság ()
Ha szükséges, adjunk hozzá egy kis php kódot letölteni az adatokat körülbelül akkora a fotót, amikor be van töltve, majd kap egy szép egyetemes forgatókönyvet.
Tulajdonképpen minden, köszönöm a figyelmet, remélem jól jön leckét.
Olvasmány olvasóink - Maxim Chagin. A forrás kérte, hogy adjon meg egy leckét, úgy tűnik, az ő helyén.
5 óra utolsó oszlopában „jQuery”
Ma szeretnénk, hogy meséljek TypeIt könyvtár - ingyenes jQuery plugin. Ön tudja használni, hogy szimulálja a gépelést. Ha minden megfelelően van beállítva, nagyon realisztikus hatás érhető el.
jQuery plugin létre egy idővonal.
jQuery plugin létre egy Gantt diagram.
Egy példa arra, hogyan hajtsák végre a letöltött fájl segítségével PHP és jQuery ajax.
Hasznos dolog, hogy ha egyszer az az ötlete támadt, hogy alkalmazza otthon egy oldalon, például valamilyen oknál fogva, max-height és max-width nem működik rendesen, és ez a funkció csak jobb.
DimaBitrix
Egy nagyon hasznos dolog, különösen a területek, ahol a galéria minden kép, ez csak az én barátom fotóalbum, meg kell tanácsot neki, hogy nézd meg ezt a bemutató, azt hiszem, szívesen. Köszönöm.
Köszönjük! Nagyon jó forgatókönyv, azonban, mint minden ezen az oldalon! Nekem különösen tetszett a demo, amikor kinyitottam, és ott láttam a szeretet - Anna Pletnev!
A mélyen meghajolt az Ön számára mindent, ami van.
Kiváló! Köszönöm szépen, kerestem valami ilyesmi))
Helló Régóta keres valami ilyesmi, de nem kap, hogy megtalálja. Nem kell, hogy növelje a kép, és az SWF fájlt. Igyekszem, hogy ezt a kódot, de nem tudott. Ha valaki azt mondja meg, hogyan kell csinálni, vagy hol kell keresni, hálás lennék. Köszi előre.
Által nyújtott információk útján két csatorna (látás és hallás) a képzés hatékonyságának sokkal jobb tanulás könyvekből. A házi feladatok és online tesztek lehetővé teszi, hogy folyamatosan úgy gondolja, a célnyelven, és azonnal ellenőrizze tudását!
Ha azt szeretnénk, hosszú ideig, hogy tanulmányozzák, hogyan lehet HTML-t, akkor engem, mert van jó hír!
Ha már megtanulta a HTML és tovább szeretne lépni, a következő lépés az lesz, hogy tanulmányozza a CSS technológiával.
Ha azt szeretnénk, hogy megértsék a fogalmak domain és tárhely, megtanulják, hogyan kell létrehozni egy adatbázist, feltölteni a fájlokat a honlapon keresztül FTP szerver, hozzon létre aldomain konfigurálja a postaládákat a helyszínen, és ellenőrzi a részvétel, a tanfolyam kifejezetten az Ön számára!