ホームページ  >  記事  >  ウェブフロントエンド  >  HTML と JavaScript を使用して、特定のサイズと機能を備えた新しいウィンドウを開くにはどうすればよいですか?

HTML と JavaScript を使用して、特定のサイズと機能を備えた新しいウィンドウを開くにはどうすればよいですか?

Linda Hamilton
Linda Hamiltonオリジナル
2024-10-26 11:12:02940ブラウズ

How to Open New Windows with Specific Dimensions and Features Using HTML and JavaScript?

Target="_blank" を使用して HTML で新しいウィンドウを開く

HTML では、target="_blank" 属性によりブラウザーに新しいウィンドウを開くように指示されます。リンクをクリックすると新しいウィンドウが開きます。ただし、この属性では、新しいウィンドウのサイズや位置を制御できません。

たとえば、次のコードを考えてみましょう。

<code class="html"><a href="facebook.com/sharer" target="_blank">Share this</a></code>

Firefox では、このコードは Facebook を開きます。新しいウィンドウではなく新しいタブでページを共有します。望ましい動作を実現するには、JavaScript を利用して新しいウィンドウを作成およびカスタマイズできます。

解決策:

次の場合に、特定のサイズの新しいウィンドウでリンクを開くにはクリックすると、次のコードを使用できます:

<code class="html"><a href="http://www.facebook.com/sharer" onclick="window.open(this.href, 'mywin', 'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;">Share this</a></code>

window.open() 関数の各パラメータの動作は次のとおりです:

  • this.href: 開くページの URL。
  • 'mywin': 新しいウィンドウの名前。
  • 'left=20,top=20' : ウィンドウの左と上の位置。
  • 'width=500,height=500': ウィンドウの幅と高さ。
  • 'toolbar=1': ツールバーを表示するかどうか。
  • 'resizable=0': ウィンドウのサイズを変更できるかどうか。

このアプローチを使用すると、target="_blank" を含むリンクをクリックしたときに、必要なサイズとカスタマイズ オプションを含む新しいウィンドウを開くことができます。

以上がHTML と JavaScript を使用して、特定のサイズと機能を備えた新しいウィンドウを開くにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。