ホームページ  >  記事  >  ウェブフロントエンド  >  GreyBox技術概要(移転)_JavaScriptスキル

GreyBox技術概要(移転)_JavaScriptスキル

WBOY
WBOYオリジナル
2016-05-16 18:15:391097ブラウズ

thinkbox、lightbox などに似ています。独自のモーダル ダイアログ ボックスにページ、画像、またはその他のコンテンツを表示するために使用されます。これは公式 Web サイトです: http://orangoo.com/labs/GreyBox/

いくつかの例を見てみましょう:

(1) Web ページを開きます:

(2) 一連の写真を表示します:

基本的な使い方

(1) 公式サイトにアクセスし、クリックしてダウンロード

(2) 解凍します。 (その中のinstallation.htmlで使い方が説明されています。とてもシンプルで一目で理解できます。手順だけ書いておきます)

(3) グレーボックス フォルダーを Web プロジェクトのルート ディレクトリにコピーします。: は Web ルート ディレクトリと他のディレクトリに配置する必要があります。セカンダリ ディレクトリは使用できますか? これは私のプロジェクト にデプロイされる方法です:

(ところで、教訓です。最初はjsフォルダーに入れました。すべてのjsスクリプトがその中にあり、jQueryもそこにあるためですが、それは使用できません...最後に、ルートディレクトリに置きます。)

をダウンロードして使用できます。

(4) これで、テストページを使用してテストします。

コードをコピーします コードは次のとおりです。

>
test.html





🎜>

では、GreyBox を使用する場合、どうやってそれを実現するのでしょうか?上記のコード、 [注] この js はサブウィンドウの Web ページに記述されています:




コードをコピー


コードは


これで、基本的に日常のプロジェクトのニーズを満たすことができる GreyBox の学習が完了しました。
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事:jquery 学習 2 属性関連_jquery次の記事:jquery 学習 2 属性関連_jquery

関連記事

続きを見る