ホームページ > 記事 > ウェブフロントエンド > JQuery によって生成された拡大効果のあるポップアップ ダイアログ ボックス (jquery プラグインは追加されていません)
JQuery によって生成された拡大効果のあるポップアップ ダイアログ ボックス (jquery プラグインは追加されていません)
- WBOYオリジナル
- 2016-05-16 17:35:011359ブラウズ
早速、本題に進み、拡大効果のあるポップアップ ダイアログを共有しましょう。プロジェクト内で必要に応じて CSS を記述できます。メトロ スタイルのサイトで再利用する予定です。
アニメーション効果はかなりクールなようです。加工するとさらに良くなります:
コードをコピー コードは次のとおりです。
;
>< ;style>
body { 背景: #ace; フォント: 12px/1.2 Arial、helvetica、サンセリフ; }
余白:5px; 100px; float:left; }
background:transparent;
position:absolute:50%;
z-index: 10001;
}
#content {
background:#fff;
margin:-50px 0 0 -50px; 🎜> 幅: 100px; 高さ: 100px;
z-index: 10001;
#mask{
上: 0;
幅: 100%;
高さ: 100%;
背景色: #000000;
z-index: 10000;
{
幅:30px;
背景色:赤;
表示:なし;
{
幅:30px;
マージン左:50px;
背景色:赤;カーソル: ポインタ;
}
"> ;
- 親指 gt;
- 親指
- 親指 ;親指 li>
- 親指
- 親指
読み込み中....
;追加されたマスク効果は、直接削除できます。必要ありません。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。