cgi pal 日記 javascriptでiframeを検知してスタイルを変更

Quick Edit Pencil

iframeで表示された時に

ヘッダとかパンくずを非表示にする

─ javascriptを使う簡易版 ─



skin.html を 編集する

skin.htmlのbodyタグとheaderタグの間にscriptタグとstyleタグをペースト
あなたの.comを親parentのurlのドメイン名に書き直す
<body>
<script type="text/javascript">
  (function() {
    if((window != window.parent)&&(/あなたの.com/.test(document.referrer))) {
      document.body.setAttribute("class", "iframe");
    }
  })()
</script>
<style type="text/css">
  /*iframeの時は次のタグを非表示にする*/
  body.iframe header,
  body.iframe h1,
  body.iframe nav,
  body.iframe footer{
    display:none;
  }
  /*iframeの時は画像のリンクを無効にする*/
  body.iframe .img{
    pointer-events:none;
  }
</style>
<header>

仕組み

iframeで読み込まれている/親ページのURLが取得できる

 指定した親ページのURLでない時

  何もしないスタイルは適用されない
  普通に表示される
<body>

 指定した親ページのURLの時

  bodyタグにクラス属性を追加する
  スタイルが適用される
<body class="iframe">

iframeで読み込まれていない/親ページのURLが取得できない

 普通に表示される
<body>


このブログの人気の投稿

PowerShellのGetDetailsOf メソッドでプロパティの詳細情報のID番号と項目名を列挙します

書字方向 横書方向変換スクリプト 左書きから右書きへ(コピペ用途)

PowerShellで複数ファイルのプロパティを取得する方法(準備編)

DOMノードオブジェクトを文字列に変換する

簡単 YouTube動画をダウンロード、音声のみ保存する方法 2019

AppleScript 改行 コード 置換

Blender: 辺の長さを数値で指定するアドオン

Powershell: プロパティの詳細情報インデックスと項目名の列挙