javascriptでhtmlのcontentのテキストが要素からはみ出したときに、フォントサイズを縮小・拡大して調節するプログラムを作ったのですが、google chromeのブラウザでしか試してないのですが、ウィンドウを最大化ボタンで大きくし、縮小ボタンを押してウィンドウの横幅を最小にして表示すると、プログラムが機能せず、テキストはみ出してしまいます。リロードすると、収まります。どうすれば、解決するのか分かりません。アドバイスください。
なお、ウィンドウの右をクリックで掴み、縮める時は機能します。
リンク:
https://codepen.io/DEN-KEN/pen/VwRyQEP
No.1ベストアンサー
- 回答日時:
サイズ変更を行うadjust()の関数が、"DOMContentLoaded"イベントが発生したときにしか動かないので、質問のような動きになります。
adjust()の関数を上記イベント内に書くのではなく、独立した関数として先に宣言しておき、"DOMContentLoaded"、"resize"のイベントリスナーの中で呼び出すようにしましょう。
function adjust() {
...
}
window.addEventListener('DOMContentLoaded', () => {
adjust()
})
window.addEventListener('resize', () => {
adjust()
})
回答ありがとうございます。原因は分かりました。嬉しいです。単純にDOMContentLoadedの記述を取ればいいのか、それとも改良の方法があるのか、分かればなお嬉しいです。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 初心者javascript ウィンドウサイズを変更したら実行するようにしたい 2 2024/01/03 19:51
- HTML・CSS 初心者html・CSS ウィンドウを縮小するとタグの一部が隠れてしまう。 1 2023/12/18 19:52
- その他(ソフトウェア) 画像の拡大率を固定したまま次の画像を表示出来るビューアを探しています 2 2022/05/13 17:19
- JavaScript 空白で入力フォームのボタンをクリックしたら、ブラウザの上部からjavascriptで 表示されるアラ 1 2022/05/20 11:16
- Windows 10 拡大鏡の音声読み上げ機能が機能しません 2 2023/02/23 22:34
- HTML・CSS HTMLで表をつくったのですがウィンドウの大きさを変化させると、表の真ん中の列だけ補足なり、表の中の 4 2024/01/03 21:57
- マウス・キーボード キーボード設定で困っています。長文です。 2 2022/12/10 12:44
- JavaScript ソースコードのいじる場所が分かりません。 1 2022/12/23 02:06
- 画像編集・動画編集・音楽編集 GIMPでの太さの設定方法 1 2023/11/20 11:27
- C言語・C++・C# このプログラミング誰か教えてくれませんか 1 2022/06/02 15:27
このQ&Aを見た人はこんなQ&Aも見ています
-
性格の違いは生まれた順番で決まる?長男長女・中間子・末っ子・一人っ子の性格の傾向
同じ環境で生まれ育っても、生まれ順で性格は違うものなのだろうか。家庭教育研究家の田宮由美さんに教えてもらった。
-
Javascriptのhtml出力についてappendChildはどのような意味があるのでしょうか?
JavaScript
-
ワードプレスインストールできない
オープンソース
-
フロントエンジニアで一人前といわれるレベルの画面
HTML・CSS
-
-
4
HTMLでwebサイトを作ってるのですが、 ボタンが押された時にjsに書いている文章の 文字コードを
HTML・CSS
-
5
大至急。webのシングルページを作ろうと考え、イラレでデザインをしました。 それからの手順で悩んでる
HTML・CSS
-
6
[初心者]javascriptのfor文でなぜか繰り返し処理をしない。理由がわかりません。
JavaScript
-
7
【JavaScript?HTML?】Webページでこのページは戻ることは出来ませんと表
JavaScript
-
8
至急。PCに詳しい人助けてください。 どうしても開きたいTSVファイルがあります。(圧縮済みで75,
Windows 10
-
9
コードレビューをお願いします。
JavaScript
-
10
ウェブ、孤立画像を検出する方法
その他(プログラミング・Web制作)
-
11
かっこいいウェブを作るテク
HTML・CSS
-
12
HTMLとJavaScriptで作ったタイマーアプリが正常に動作しない
JavaScript
-
13
プログラミング言語の制作方法について
C言語・C++・C#
-
14
HTMLとJavaScriptで作ったタイマーアプリで時間分の設定方法がわからない
JavaScript
-
15
HTMLでデスクトップの画像がでない
HTML・CSS
-
16
CSV出力を画面から選択したデータ項目のみを出力させたいです。
Java
-
17
卒業研究でよく分からないところがあるので教えて欲しいです。 インバータ用組み込みソフトウェア開発シス
C言語・C++・C#
-
18
JavaScriptで作ったアプリが正常に動作しない。改善したい。
JavaScript
-
19
このように書くべきですか? { object = action() if(object.isSucc
その他(プログラミング・Web制作)
-
20
出発駅A、到着駅Bを選択すると、2.3㎞と170円と返るようにしたいです。
JavaScript
関連するカテゴリからQ&Aを探す
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
エクセルのシート上に別のシー...
-
Javascript_submit()完了後に処...
-
ウィンドウの2重起動を防止したい
-
VBの画面で、全ウィンドウを一...
-
JavaScriptで指定Windowを最大...
-
子ウィンドウの「閉じる(×)」...
-
サブウィンドウを複数表示でき...
-
子→親ウインドウへデータを受け...
-
VBAで任意のウインドウのサイズ...
-
ブラウザ(IE)からエクスプロー...
-
ホームページのリンクの貼り方...
-
IEでのみ発生するJavaScriptエラー
-
別ウインドウからフォームを操...
-
<EXCEL/VBA> OUTLOOKのウインド...
-
子ウィンドウから親ウィンドウ...
-
せっかく開いたウィンドウが閉...
-
親ウィンドウオブジェクトを、...
-
メニューバーが表示されないウ...
-
ウィンドウ名からウィンドウオ...
-
ウィンドウのつかみ方がよく分...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
エクセルのシート上に別のシー...
-
Javascript_submit()完了後に処...
-
デスクトップ画面を4分割するには
-
VBAで任意のウインドウのサイズ...
-
VBの画面で、全ウィンドウを一...
-
ウィンドウの2重起動を防止したい
-
ウィンドウ名からウィンドウオ...
-
ポップアップと作業ウィンドウ...
-
子ウィンドウの存在確認
-
インタネットからPDFファイルだ...
-
<EXCEL/VBA> OUTLOOKのウインド...
-
子ウィンドウを常に手前表示、...
-
window.Openをモーダルにできま...
-
ブラウザ(IE)からエクスプロー...
-
JavaScriptで指定Windowを最大...
-
子→親ウインドウへデータを受け...
-
1クリックでモーダルを開いてか...
-
親ウィンドウから開いた子ウィ...
-
初心者javascript グーグルクロ...
-
孫ウインドウを閉じたら親をリ...
おすすめ情報