2008 2008年 10月 3

あなたのウェブページのために、シンプルで軽量、クロスブラウザのライト

わずかライトのときには、Googleを見つけることができ、それは存在しないこと。 私が見つけた物のほとんどの問題は、それらが皆、1つまたはjQuery、プロトタイプ、MooToolsのと同類のような他の重量のJavaScriptフレームワークを使用するように見えたということでした。 彼らはすべてのクールで見てしゃれています。 しかし、あなたの要件である" しかし、私は私のサイトの場合は単純で軽量なライトボックスのスクリプトを使用したい "場合は、ここにある。

このライトボックスの気の利いた機能

  1. 非常に軽い
    パックされたスクリプトの4キロバイト(8キロバイトはアンパック)
    B。 CSSの2キロバイト
    C。 物コンテナのHTMLに数行の
  2. 理解し、実装するのが簡単
  3. 同じページに複数のライトを持つことができます。
  4. 同じ物コンテナがクリックされたリンク/オプションに応じて、(別ページに隠された部門として含まれている)、さまざまなコンテンツを表示するために使用されています。
  5. 自動的にページスクロール量と物の内容の高さは、考慮などのウィンドウの高さと幅(画面解像度)など、すべての要因を取って、自身を中心
  6. IE 7&FFでテスト

デモを見る |
ライトボックスのダウンロードソースの郵便番号(1792回ダウンロードされる)


[ZIPファイル内のファイル]ボックスを使用して、

jo.js、jo_pack.js [パックバージョン]: -要素は、ウィンドウやドキュメントの位置決めスクリプトを含むJavaScriptオブジェクトの単純なセット[JO]、。 あなたには、いくつかの高度なJavascriptingを持つ手が汚れて取得したいのであれば、抽象的な機能は、拡張要素のプロパティなどを作成し、JO.JSを開くことができます。 Javascriptingであなたはあまりされていない場合は、単独でそれを残す。

lightbox.js、lightbox_pack.js [パックバージョン]: -ライトボックスマネージャのスクリプトが含まれています。 ページ上でライトを実装するのにも責任を負いページデザイナーである場合、あなたはLightBoxManagerを理解する必要があります。 LightBoxManagerは基本的には2つの関数showLightBoxとcloseLightBoxが含まれています。

lightbox.css: -あなたがCSSを知っていれば、あなたはルック·アンド·フィールlightbox.cssをカスタマイズするには、lightbox.cssで遊ぶことができ

index.htmlの 2つの異なるコンテンツを持つ物のサンプル実装

lb_underlay_bkg.png: - [建築が開いている間は、アンダーレイは、ページ上の他のエンティティをクリックしてからユーザーを防ぐことができlighbox、下の層である]これは、ライトの下敷きの背景を使用されているシミ/光透明なイメージです。 ページのデザインと要件に応じて、さらに任意のイメージまたはこの目的のためにソリッドカラーを使用することができます。

icon_lb_close.gif: -ライトボックスの右上のcloseライトハンドルのイメージ。 デザインごとに、任意の画像を使用することができます

デモを見る |
ライトボックスのダウンロードソースの郵便番号(1792回ダウンロードされる)

私たちはあなたのコメントやフィードバックを持たせてください...


NDKホーム | ITを表現 | 表現口蓋 | Penmenshipを表現 | 表現する素晴らしい | 自分を表現