ほとんどの人は、さまざまな形でWindowsをポップアップするためにWebページを使用する方法を知っていると思いますが、今日のさまざまなポップアップウィンドウを作成する方法について学びましょう。
1.フル画面ウィンドウを開きます
コードは次のとおりです。
<html> <body //www.vevb.com '、' wulin.com '、' fullscreen '); ">; <b> www.vevb.com </b> </body> </html>
2。F11によって変換されたウィンドウを開きます
コードは次のとおりです。
<html> <body '//www.vevb.com'、 'wulin.com'、 'ChannelMode'); ">; <b> www.vevb.com </b> </body> </html>
3.お気に入りのリンクツールバーでウィンドウを開きます
コードは次のとおりです。
<html> <body www.wangye8.com '、' wulin.com '、' width = 400、height = 300、directories '); "> <b> www.wangye8.com </b> </body> </html>
4. [Webページ]ダイアログボックス
コードは次のとおりです。
<html> <スクリプト言語= "javascript"> <! - showmodaldialog( '// www.vevb.com、' wulin.com '、' dialogwidth:400px; dialogheight:300px; dialogleft:200px; dialogtop:150px; section:yes:yes:yes:yes:yes:yes; <b> www.wangye8.com </b> </body> </html> <html> <スクリプト言語= "javascript"> <! - showmodelessdialog( '// www.vevb.com、' wulin.com '、' dialogwidth:400px; dialogheight:300px; dialogleft:200px; dialogtop:150px; center:yes; help:yes; resizable:yes status:yes ') <b> http://www.wangye8.com </b> </body> </html>
showmodaldialog()またはshowmodelessdialog()は、[Web]ダイアログボックスを呼び出します。 showmodaldialog()とshowmodelessdialog()の違いについては、showmodaldialog()(モードウィンドウと呼ばれる)によって開かれたウィンドウが親ウィンドウに配置され、親ウィンドウにアクセスするために閉じている必要があります(脱毛を避けるためにできるだけ使用することをお勧めします); showmodelessdialog()
Dialogheight:Iheightは、ダイアログウィンドウの高さを設定します。
ダイアログウィッド:iWidthダイアログウィンドウの幅を設定します。
ダイアログレフト:ixposは、デスクトップの左上隅に比べてダイアログウィンドウの左の位置を設定します。
ダイアログトップ:IEPOSは、デスクトップの左上隅に比べてダイアログウィンドウの上部位置を設定します。
センター:{はい|いいえ| 1 | 0}デスクトップのダイアログボックスを中央に配置するかどうかを指定します。デフォルト値は「はい」です。
ヘルプ:{はい|いいえ| 1 | 0}ダイアログウィンドウにコンテキストに敏感なヘルプアイコンが表示されているかどうかを指定します。デフォルト値は「はい」です。
resizable:{yes |いいえ| 1 | 0}ダイアログウィンドウサイズが可変かどうかを指定します。デフォルト値は「いいえ」です。
ステータス:{はい|いいえ| 1 | 0}ダイアログウィンドウにステータスバーが表示されているかどうかを指定します。非モードダイアログウィンドウの場合、デフォルト値は「はい」です。 [モード]ダイアログウィンドウの場合、デフォルト値は「いいえ」です。
5。その他のポップアップウィンドウコード
インターネットを頻繁にサーフィンする友人は、そのようなウェブサイトを訪れた可能性があります。ホームページに入ると、ウィンドウがすぐにポップアップ表示されるか、リンクまたはボタンを押してポップアップします。通常、いくつかの予防措置、著作権情報、警告、歓迎、または著者が特別なプロンプトを提供したい情報。実際、そのようなページを作成するのは非常に簡単です。ページのHTMLにいくつかのJavaスクリプトコードを追加するだけです。次に、その謎を分析します。
【最も基本的なポップアップウィンドウコード】
実際、コードは非常に簡単です:
コードは次のとおりです。
<スクリプト言語= "java script"> <! - window.open( 'page.html') - > </script>
これはJavaスクリプトコードの一部であるため、<スクリプト言語= "Javaスクリプト">タグと</scrip>の間に配置する必要があります。 <! - および - >は、低いバージョンの一部のブラウザに役立ちます。これらの古いブラウザでJavaスクリプトがサポートされていない場合、タグのコードはテキストとして表示されません。
window.open( 'page.html')は、新しいウィンドウpage.htmlのポップアップを制御するために使用されます。 page.htmlがメインウィンドウと同じパスにない場合、パスは前に書かれている必要があります。絶対パス(http://)と相対パス(../)の両方が問題ありません。
単一の引用符と二重引用符を使用しても構いませんが、それらを混ぜないでください。
このコードは、HTMLの任意の場所に追加でき、<head>と</head>の間に追加できます。ポジションが高いほど、特にページコードが長い場合に実行が早くなると、ページを早期にポップアップしたい場合は、それを提出してみてください。
【設定後のポップアップウィンドウ
ポップアップウィンドウの外観の設定について話しましょう。上記のコードにもう少し追加するだけです。
このポップアップウィンドウの外観、サイズ、ポップアップの位置をカスタマイズして、ページの特定の状況に合わせています。
コードは次のとおりです。
<スクリプト言語= "javaスクリプト:> <! - window.open( 'page.html'、 'newwindow'、 'heigh = 100、width = 400、top = 0、left = 0、toolbar = no、no、scrollbars = no、recizable = no、no、no、no = no')
パラメーター説明:
<スクリプト言語= "java script"> JSスクリプトが始まります。
window.openコマンドをオープンして、新しいウィンドウをポップアップします。
page.html新しいウィンドウのファイル名がポップアップします。
NewWindowポップアップウィンドウ(ファイル名ではなく)の名前。空に置き換えることができます」;
高さ= 100ウィンドウの高さ。
TOP = 0画面上部からウィンドウのピクセル値。
左= 0画面の左側からウィンドウのピクセル値。
ツールバー=いいえツールバーを表示するかどうか、はい、ディスプレイです。
Menubar、Scrollbarsはメニューバーとスクロールバーを意味します。
resizable =いいえ、ウィンドウサイズを変更するかどうかは、はいが許可されています。
場所=いいえアドレスバーを表示するかどうか、はいが許可されています。
ステータス=いいえステータスバーに情報を表示するかどうか(通常、ファイルはすでに開いています)、はいは許可されています。
</script> JSスクリプトは終了します。
function関数を使用してポップアップウィンドウを制御する】
これが完全なコードです。
コードは次のとおりです。
<html> <head> <スクリプト言語= "java script"> <! - function openwin(){window.open( "page.html"、 "newWindow"、 "height = 100、width = 400、toolbar = no、menubar = no、scrollbars = no、seaizable = no、status = no> > ...任意のページコンテンツ... </body> </html>ここにopenWin()が定義されている関数があり、関数の内容はウィンドウを開くことです。それが呼ばれるまで役に立たない。それを呼ぶ方法は?
方法1:<body>ブラウザがページを読み取るときにポップアップウィンドウが表示されます。
方法2:<body>ブラウザがページを離れるとポップアップウィンドウが表示されます。
方法3:接続で呼び出します:<a href = "#">ウィンドウを開く</a>
注:使用される「#」は仮想接続です。
方法4:ボタンで呼び出します:<入力タイプ= "ボタン"値= "window">
[ファイル1.HTMがメインウィンドウに開かれ、小さなウィンドウページが同時にポップアップします]
次のコードをメインウィンドウ<head>領域に追加します。
コードは次のとおりです。
<スクリプト言語= "java script"> <! - function openwin(){window.open( "page.html"、 ""、 "width = 200、height = 200";)} //-> </script><body>領域を追加するだけです:<a href = "1.htm"> open </a>。
pop-upウィンドウの制御タイミングの閉鎖制御】
ポップアップウィンドウを制御しましょう。効果はさらに良くなります。ポップアップページに小さなコードを追加した場合(メインページではなくpage.htmlのHTMLに追加されていることに注意してください...)、10秒後に自動的に閉じるのはクールではありませんか?
まず、次のコードをpage.htmlファイルの<head>領域に追加します。
コードは次のとおりです。
<スクリプト言語= "java script"> function closeit(){setimeout( "self.close()"、10000)// ms} </script>次に、Page.htmlの元の文<body>の代わりに<body>を使用します。 (この文を書くことを忘れないでください!この文の目的は、ウィンドウを閉じるコードを呼び出し、10秒後にウィンドウを自分で閉じることです。)
popupポップアップウィンドウに閉じるボタンを追加する】
コードは次のとおりです。
<form>
<入力型= 'ボタン'値= 'close'
</form>
ハハ、今はもっと完璧です!
[ポップアップウィンドウを含む - ページごとに2つのウィンドウ]
上記の例にはすべて2つのウィンドウが含まれています。1つはメインウィンドウ、もう1つはポップアップウィンドウです。
次の例を使用すると、上記の効果をページに記入できます。
コードは次のとおりです。
<html> <head> <スクリプト言語= "java script"> function openwin(){openwindow = window.open( ""、 "newwin"、 "height = 250、width = 250、toolbar = no、scrollbars ="+scroll+"、menubar = no";); // openwindow.document.write( "<title> example </title>";)openwindow.document.write( "<body bgcolor =#fffff>";)openwindow.document.write( "<h1> hello!</h1>"; openWindow.document.write( "</body>";)openwindow.document.write( "</html>";)openwindow.document.close()} </script> </head> <body> <a href = "#"> window </a> <入力タイプ= "Valut =" Valut "openWindow.document.write()のコードが標準のHTMLではないかどうかを見てみましょう。形式でより多くの行を書くだけです。もう1つのラベルまたは1つのラベルが少ない場合は、エラーを引き起こすことに注意してください。 openWindow.document.close()で終了することを忘れないでください。
【究極のアプリケーション - ポップアップウィンドウのクッキーコントロール】
上記のポップアップウィンドウはクールですが、少し問題があることを思い出してください(たとえば、あなたはそれを見つけてはいけませんよね?)。とても迷惑ではありませんか?解決策はありますか?はい!私に従ってください。 Cookieを使用して制御するだけです。
まず、メインページHTMLの<head>領域に次のコードを追加します。
コードは次のとおりです。
<script> function openPopup(){window.open( "hello.htm"、 ""、 "width = 300、height = 300")//ポップアップウィンドウを変更} function get_cookie(name){var search = name + "=" var returnvalue = ""; if(documents.cookie.length> 0){offset = documents.cookie.indexof(search)if(offset!= -1){// cookieが存在する場合、offset += search.length //値の開始end = document.cookie.indexof( ";"、offset); //クッキー値の終了のインデックスを設定するif(end == -1)end = documents.cookie.length; returnValue = unescape(documents.cookie.substring(offset、end))}} returnValue; } function loadpopup(){if(get_cookie( 'popped')== ''){openPopup()documents.cookie = "popped = yes"}} </script>次のコードをボディ領域に入力します。
<body> //ページを離れるときにポップします
または:
<body> //ページを入力するときにポップします
このページを更新したり、再入力したりすることができれば、ウィンドウが二度とポップアップ表示されることはありません。本物のポップのみのオンリー!
これを書いて、ポップアップウィンドウの制作とアプリケーションのテクニックは基本的に完成しました。 Webページを作っている友人を助けてくれてとてもうれしいことを願っています。
JSスクリプトのケースは、前後に一貫性を保つのが最適であることに注意する必要があります。
メニュー、ツールバー、アドレスバーのないポップアップウィンドウ:
コードは次のとおりです。
<スクリプト言語= "javaスクリプト"> <! - var gt = unescape( '%3e'); var popup = null; var over = "起動ポップアップナビゲーター"; popup = window.open( ''、 'popupnav'、 'width = 500、height = 500、resizable = 0、scrollbars = auto'); // width = 500、height = 500はウィンドウの長さと幅ですif(popup!= null){if(popup.opener == null){popup.opener = self; } popup.location.href = '開くファイル名'; } // - > </script>方法2:Cookiesアプリケーション:ポップアップウィンドウをコントロールページにポップポップアップウィンドウを設定すると、ページを再ブローするたびにポップウィンドウが自動的にポップアップされ、不必要なトラブルが発生します。では、この問題を解決する方法は?ここでは、簡単な例を使用して、クッキーを操作して初めてページを閲覧するときにポップアップポップアップをポップアップする方法を説明します。
コードを次のようにコピーします。<script>関数openPopWindow(){window.open( "hello.htm"、 ""、 "width = 200、height = 200" //自分でポップアップウィンドウを変更} function get_cookie(name){var search = name + "="; var returnvalue = "; document.cookie.indexof(search); returnvalue = unescape(document.cookie.substring(end)}} function loadpopup(){get_cookie( 'popped')== ''){openpopwindow();
上記のコードをボディエリアに入力します:<body> //ページを離れるときにポップアウトします
または:<body> //ページを離れるときにページがポップアップすると、ポップアップウィンドウの効果がポップアップします。
効果:他の人がこのページを閉じると、窓がポップアップし、祝福の言葉を書くことができます
コアコード:
コードは次のとおりです。
<スクリプト言語= "javascript"> <! - begin function reave(){window.open( '1.htm'、 "、 'toolbar = no、no、no、no、no、height = 225、width = 235'); break} // end-> </scrip>上記はこの記事のすべての内容です。みんなの学習に役立つことを願っています。誰もがwulin.comをもっとサポートすることを願っています。