Îmi ofer glisorul meu de imagine simplu pe platforme. Este afișată numai partea clientului. Pentru funcționarea completă, este necesar un server de server, care este responsabil pentru generarea unei liste de imagini afișate. Vă rugăm să o considerați pregătire pentru o dezvoltare ulterioară.
Nume de cod uSlider (de la umi)
oportunități
restricţii
Sub IE8 nu a verificat.
În IE8 funcționează cu restricții:
- fundalul semi-transparent pentru semnătură nu este emis (poate fi înlocuit de o imagine în PNG, a se vedea css)
- nu afișați săgețile stânga și dreapta (există un hack în js)
Există o nuanță în stabilirea dimensiunii. Salvarea proporțiilor cursorului când redimensionarea ferestrei browserului se face prin fundul de umplutură în% din lățimea containerului care conține. Poate că, nu cu niciun raport al laturilor imaginilor, va fi posibil să se realizeze o coincidență ideală a limitelor.
Notă. După cum știți, numai imaginile au proprietatea de a schimba dimensiunea uneia dintre laturi pentru a păstra proporțiile. În acest caz, blocul obișnuit va păstra înălțimea. Soluționarea este de a crea un bloc auxiliar de împachetare. Pentru blocul țintă, setați înălțimea la auto. Blocați învelișul în interiorul țintă, setați lățimea la 100% și selectați înălțimea prin setarea în partea inferioară în%. În acest caz, valoarea liniuței va fi calculată din lărgimea blocului părinte (țintă). De exemplu, blocul țintă are o lățime de 1000 pixeli. Blocul de împachetare are un fund de umplutură: 40%. Înălțimea totală a întregii structuri va fi de 400 de pixeli. Evident, dacă lățimea blocului exterior este setată în% din lățimea ferestrei, atunci obținem o schimbare și înălțimi proporționale.
cerinţe
Am folosit mootools 1.4.5, 1.5.1
cerere
Conectați scriptul de slider și fișierul de stil:
În locul dorit din pagină, adăugați o etichetă:
Glisorul primește date din backend sub forma unui tablou. Deschideți fișierul slider.js, găsiți șirul în el
și înlocuiți-o cu calea spre scriptul care generează datele. Scriptul ar trebui să returneze o matrice a formularului:
În rândul Imagini [0] 0 este numărul de serie al cursorului, dacă există mai multe dintre ele pe pagină. Este folosit în mod implicit dacă php nu are parametri.
Următoarea este o listă de imagini care prezintă calea spre imagine, semnătura, legătura destinație. Orice alt parametru decât src poate fi gol, dar trebuie să fie prezent în matrice.
Chiar și scriptul dvs. ar trebui să ofere tipul corect de conținut și codare
Ce poate fi îmbunătățit
Adăugați ca parametru personalizat calea spre backend. Salt pe datele ca o matrice la JSON, astfel încât, de exemplu, galerie nu va genenerirovat pe zbor, și fișierul cache.