Posts tagged 'lightbox "

Paprasta, lengva, Cross Browser švieslentė jūsų tinklalapį

Penktadienis, spalis 3, 2008 Autorius nikhil

Ne todėl, kad ten yra tik keletas švieslentė s, kad jūs galite rasti, kai jūs google. Problema su dauguma švieslentes, kad aš rasiu buvo tai, kad jie visi atrodė naudoti vieną ar kitą sunkiasvorio javascript sistemas kaip JQuery, prototipas, MooTools ir mėgsta. Jie visi yra kietas ir Swanky ieškote. Bet jei jūsų reikalavimas yra "bet aš noriu paprastą ir lengvas švieslentė scenarijų savo svetainę", tada čia yra;

Kai naudingų funkcijų šio vaizdai

  1. Labai lengvas
    . 4kb scenarijus, kai supakuotas (8 kb išpakuoti)
    b. 2 kb CSS
    c. Keletas eilučių HTML skirti švieslentės konteinerį
  2. Paprasta suprasti ir įgyvendinti
  3. Gali turėti daug švieslenčių tame pačiame puslapyje.
  4. Pats švieslentę konteineris naudojamas norint parodyti, skiriasi turinys (kuris yra atskirai įtrauktos kaip paslėpti padalinių puslapyje), priklausomai nuo Link / variantą, kuris yra paspaudėte.
  5. Automatiškai centrai pati, atsižvelgiant į visus veiksnius, kaip antai, lango aukštis ir plotis (ekrano rezoliucija), puslapio slinkties dydžio ir iš švieslentę turinį aukščio
  6. Patikrinta IE 7 ir FF

Peržiūrėti Demo |
Parsisiųsti lightbox Source Zip (Siuntėsi 2121 kartų)


Naudojant švieslentė [failai zip failą]

jo.js, jo_pack.js [supakuota versija]: - paprastas rinkinys JAVASCRIPT OBJEKTAI [OL], kuriame yra elementų, langų ir dokumentas padėties scenarijus. Galite atidaryti JO.JS, jei norite gauti savo rankas purvinas su kai kurių pažangių Javascripting, kuriant abstrakčius funkcijas, išplečiant elementų savybes ir tokių. Jei ne per daug Javascripting, palikite jį ramybėje.

lightbox.js, lightbox_pack.js [supakuotas Version]: - Turi šviesos lange vadybininkas scenarijus. Jei esate projektuotojas, taip pat yra atsakingas įgyvendinant švieslentės puslapyje, jūs turite suprasti, kad LightBoxManager. LightBoxManager iš esmės yra tik du funkcijas showLightBox ir closeLightBox.

lightbox.css: - Jei žinote, CSS, galite pažaisti su lightbox.css tinkinti išvaizdą-n-jausti lightbox.css

index.html: Pavyzdys įgyvendinimas švieslentę su dviejų skirtingo turinio

lb_underlay_bkg.png: - Tai šviesa / Simi skaidrus vaizdas, kuris yra naudojamas už švieslentės pakloto [Paklotas yra žemiau lighbox, kuri apsaugo vartotoją nuo paspausdami bet kurį kitą subjektą apie puslapį sluoksnis, o švieslentę atidaryta] fone. Galite naudoti bet kokį vaizdą ar net tvirtą spalvą šiam tikslui, priklausomai nuo puslapio dizainas ir reikalavimas.

icon_lb_close.gif: - glaudžiai švieslentę rankena viršuje dešinėje šviesos lange vaizdą. Galima naudoti bet kokį vaizdą, kaip už dizainą

Peržiūrėti Demo |
Parsisiųsti lightbox Source Zip (Siuntėsi 2121 kartų)

Prašome leiskite mums turėti savo komentarus ir atsiliepimus ...


get ExpressingIT News by Email Prenumeruoti ExpressingIT elektroniniu paštu arba Follow Me on Twitter


Prenumeruoti ExpressingIT RSS
get ExpressingIT News by Email Prenumeruoti ExpressingIT elektroniniu paštu
Follow Me on Twitter