ホームページ > ウェブフロントエンド > ライユイのチュートリアル > Lauiuiでポップアップボックスのサイズを調整する方法

Lauiuiでポップアップボックスのサイズを調整する方法

藏色散人
リリース: 2020-11-18 10:34:03
オリジナル
5773 人が閲覧しました

layui でポップアップ ボックスのサイズを調整する方法: まず新しい HTML コード ページを作成し、次にリンクを使用して外部スタイルの Layer.css ファイルをリンクし、次にポップアップ ボックスを作成します。最後に「layer.opren()」メソッドで使用します。「area:[]」でポップアップボックスのサイズを設定できます。

Lauiuiでポップアップボックスのサイズを調整する方法

推奨: 「layUI チュートリアル

フロントエンド開発ツールを開き、新しい HTML コード ページを作成します。

Lauiuiでポップアップボックスのサイズを調整する方法

#ページで タグを探し、このタグの後ろにあるリンクを使用して外部スタイルの Layer.css ファイルをリンクします<p></p> <p><img src="https://img.php.cn/upload/image/164/916/295/1605666728677014.png" title="1605666728677014.png" alt="Lauiuiでポップアップボックスのサイズを調整する方法"> #リンクされたlayer.cssファイルの後に2つの外部ファイルjquery.jsとlayer.jsを挿入します </p> <p></p> <p><img src="https://img.php.cn/upload/image/472/282/979/1605666732908481.png" title="1605666732908481.png" alt="Lauiuiでポップアップボックスのサイズを調整する方法"> ポップアップ ボックスを作成します。新しい <script> タグを作成し、このタグ内で Layer.open() を使用してポップアップ ボックス関数を作成します。 </script></p> <p>ポップアップ ボックス コードの作成: </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">layer.open({ type: 2, content: "test.html" })</pre><div class="contentsignin">ログイン後にコピー</div></div><p></p><p><img src="https://img.php.cn/upload/image/796/844/341/1605666742814047.png" title="1605666742814047.png" alt="Lauiuiでポップアップボックスのサイズを調整する方法"/>ポップアップ ボックスの効果を表示します。 HTMLコードファイルを保存した後、ブラウザで開くと、ポップアップボックスが機能的に実装されていることがわかります。ポップアップボックス。ポップアップ ボックスの幅/高さを設定するには、layer.opren() メソッドで area:[] を使用します。 </p><p>コード: </p><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">layer.open({ type: 2, area:["500px","400px"], content: "test.html" })</pre><div class="contentsignin">ログイン後にコピー</div></div><p><img src="https://img.php.cn/upload/image/939/620/517/1605666746963699.png" title="1605666746963699.png" alt="Lauiuiでポップアップボックスのサイズを調整する方法"></p> <p>HTML コードを保存し、ブラウザ ページを更新すると、ポップアップ ボックスのサイズが変更されたことがわかります</p> <p></p> <p></p>

以上がLauiuiでポップアップボックスのサイズを調整する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート