Simple, léger, ma navigateur Croix pour votre site web
Non qu'il n'y ait que quelques-uns LIGHTBOX que vous pouvez trouver lorsque vous google. Le problème avec la plupart des visionneuses que j'ai trouvé était que tout le monde semblait d'utiliser un ou des autres frameworks JavaScript lourds de poids comme jQuery, Prototype, Mootools et les goûts. Ils sont tous frais et chic à la recherche. Mais Si votre exigence est "MAIS JE VEUX UN SCRIPT LIGHTBOX simple et léger pour MON SITE", puis ici il est;
Quelques fonctionnalités intéressantes de cet album
- Très léger
une. 4kb de scripts replié (8 kb déballé)
b. 2 kb du CSS
c. Quelques lignes de code HTML pour le conteneur lightbox - Simple à comprendre et à mettre en œuvre
- Peut avoir plusieurs albums sur la même page.
- Le conteneur lightbox même est utilisée pour montrer, un contenu différent (ce qui est inclus séparément en tant que divisions cachés dans la page), en fonction sur le lien / option qui est cliqué.
- Centre automatiquement lui-même, en prenant en considération tous les facteurs tels que, la hauteur et la largeur de fenêtre (résolution de l'écran), le montant de défilement des pages et la hauteur du contenu de la visionneuse
- Testé dans IE 7 et FF
Voir la démo |
Télécharger Zip Source Visionneuse (Téléchargé 1808 fois)
Utilisation de l'album [Fichiers dans le fichier zip]
jo.js, les jo_pack.js [version emballés]: - un ensemble simple d'objets JavaScript [JO], qui contient l'élément, la fenêtre et scripts de positionnement de documents. Vous pouvez ouvrir JO.JS si vous souhaitez vous salir les mains avec une certaine avancée JavaScripting, la création de fonctions abstraites, qui s'étend des propriétés des éléments et autres. Si vous n'êtes pas trop JavaScripting, Laissez-le tranquille.
lightbox.js, lightbox_pack.js [version compactée]: - contenir la lumière scripts administrateur de la boîte. Si vous êtes concepteur de la page, également responsable de la mise en œuvre de la visionneuse sur la page, vous devez comprendre l'LightBoxManager. LightBoxManager contient essentiellement showLightBox seulement deux fonctions et closeLightBox.
lightbox.css: - Si vous connaissez le CSS, vous pouvez jouer avec lightbox.css pour personnaliser l'apparence-n-feel lightbox.css
index.html: exemple d'implémentation de l'album avec deux contenus différents
lb_underlay_bkg.png: - C'est la lumière / Simi image transparente qui est utilisé pour le fond de la sous-album [sous-couche est la couche en dessous de la lighbox, ce qui empêche l'utilisateur de cliquer sur une autre entité sur la page, tandis que la visionneuse est ouvert]. Vous pouvez utiliser n'importe quelle image ou même d'une couleur unie à cet effet, en fonction de la mise en page et l'exigence.
icon_lb_close.gif: - L'image de la poignée Close en haut à droite de la boîte à lumière. Peut utiliser n'importe quelle image comme par dessin ou modèle
Voir la démo |
Télécharger Zip Source Visionneuse (Téléchargé 1808 fois)
S'il vous plaît laissez-nous vos commentaires et suggestions ...
