Skip to main content
Participating Frequently
November 14, 2022
質問

ブラウザ確認中、誤って「フレームを再読み込み」をクリックしてしまった!

  • November 14, 2022
  • 返信数 1.
  • 1112 ビュー

ドリームウィーバーでサイト制作中にグーグルクロームで確認していたところ、誤って「フレームを再読み込み」をクリックしてしまい、ページの上に余白が付いてしまいました。クロームの検証ツール上にも意図しないiframeが追加されております。ドリームウィーバーのライブ画面上でもページの上に余白が付いている状態です。どうすれば余白がなかった以前の状態に戻せるのでしょうか?ご回答よろしくお願いします。

    このトピックへの返信は締め切られました。

    返信数 1

    r360studio Kazue Mori
    Community Expert
    Community Expert
    November 15, 2022

    nb993さん、こんにちは。

    お書きの情報だけでは、現象の理由にたどり着けないので、回答がつかないようです。。

     

    Chrome(クロム)ブラウザの「フレームを再読み込み」は、表示中のページのソースコードを再読み込みし、そのファイルを最後に保存した状態の表示に戻すための機能のため、これを実行したからといって、ソースコードが書き換わることはないです。

     

    お書きいただいた内容から推察するに、対象となるページ(HTMLファイル?)に、意図しない余白を作っているソースコードが存在するようです。

     

    そのページのソースコード(HTMLやCSSなど一式)がわかれば、該当する部分を調べることができるかもしれません(nb993さんのお仕事の守秘義務に抵触しない範囲で、提示が可能であればよいのですが)。

     

    また、入り組んだ問題ですと、調査時間もかかるので、コミュニティの参加者の方から答えがつくのがむずかしいかもしれません。

    .

    nb993作成者
    Participating Frequently
    November 15, 2022

    分かりづらくて申し訳ございません。

    自身で作成したソースコードは変わっておりません。ただ、ドリームウィーバーのライブプレビューとブラウザで表示すると余計な余白(ページ最上部)が付いております。

    また、検証ツールのエレメンツにも見覚えのないiframe要素が追加されています。

    nb993作成者
    Participating Frequently
    November 17, 2022

    nb993さん、「ページのソースを表示」ではiframe要素が無いということであれば、やはり、JavaScriptなど、外的なプログラムが実行された結果、そこにiframe要素が追加されているのではないでしょうか?

     

    HTMLコードの中に、HTMLではないコードや、理解できないコードはありませんか?
    もしくは、拡張子がJSなどの外部ファイル等を読み込んでいるコードはないでしょうか?

     

    あれば、それのコードを外してみて、iframe要素が追加されるかどうかを確認してみてください。

    もし、該当するものがあれば、そのコードが原因だと思われます。

    .

     


    HTMLファイルから直接Chromeでページを開き「ページのソースを表示」で確認したところ、理解できないコードや拡張子がJSなどの外部ファイル等を読み込んでいるコードはありませんでした。しかし、ドリームウィーバーのブラウザプレビューからページを開き「ページのソースを表示」で確認したところ、下記のソースが表示させました。

     <!doctype html>
     <html lang="en">
     <head>
     <!-- Copyright 2015 Adobe Systems Incorporated. All rights reserved. -->
     <meta charset="utf-8">
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
     <!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=9" ><![endif]-->
     <title>Device Preview</title>
     <meta name="viewport" content="width=device-width, height=device-height, user-scalable=no, maximum-scale = 1.0, minimum-scale=1.0,initial-scale=1.0" >
     <script src="js/jquery.min.js"></script>
     <script src="js/URI.js"></script>
     <script src="js/constants.js"></script>
     <script src="js/DevicePreviewUtils.js"></script>
     <script src="js/DevicePreviewSocketApp.js"></script>
     <script src="js/DevicePreviewMessageHandler.js"></script>
     <script src="js/DevicePreviewMain.js"></script>
     <link rel="stylesheet" type="text/css" href="css/main.css">
     </head>
     <body>
     <iframe id="previewApp" allowfullscreen src=""></iframe>
     <div class="overlay">
     <table class="container">
     <tr>
     <td>
     <div class="centerAlign margin2x"><img src="images/dw_logo.png"></div>
     <div class="centerAlign margin2x deviceInfo"></div>
     <div class="centerAlign margin1x browserInfo"></div>
     <div class="centerAlign margin1x osInfo"></div>
     <div class="centerAlign margin1x viewportSize"></div>
     <div class="centerAlign margin1x devicePixelRatio"></div>
     </td>
     </tr>
     </table>
     </div>
     </body>
     </html>