質問編集履歴

3

試したことの修正

2022/05/14 05:23

投稿

scottie320
scottie320

スコア27

test CHANGED
File without changes
test CHANGED
@@ -72,7 +72,7 @@
72
72
  ```
73
73
  ### 試したこと
74
74
  画像の容量を小さくしてみましたが、変わりませんでした。
75
- また下記コードを試しましたが、firstimgを取得できず、フェードアウトしない状態です。
75
+ また下記コードを試しましたが、firstimgを取得できず、logが出力されない状態です。
76
76
  ```php
77
77
  <div class="first-img" >
78
78
  <p><img src="<?php echo esc_url(get_template_directory_uri()); ?>/imgs/top/visual_bg.jpg" alt="r" id="firstimg"></p>

2

試したことの修正

2022/05/14 05:22

投稿

scottie320
scottie320

スコア27

test CHANGED
File without changes
test CHANGED
@@ -93,10 +93,6 @@
93
93
  var img_elements = document.getElementById('firstimg');
94
94
  for (var i = 0; i < img_elements.length; i++) {
95
95
  img_elements[i].addEventListener('load', (e) => {
96
- // function(){
97
- // $('.first-img').fadeOut(1500);
98
- // $('#main').fadeIn(800);
99
- // }
100
96
  console.log(" load");
101
97
  });
102
98
  img_elements[i].src = img_elements[i].getAttribute("src");

1

試したことの追加

2022/05/14 05:21

投稿

scottie320
scottie320

スコア27

test CHANGED
File without changes
test CHANGED
@@ -72,5 +72,38 @@
72
72
  ```
73
73
  ### 試したこと
74
74
  画像の容量を小さくしてみましたが、変わりませんでした。
75
+ また下記コードを試しましたが、firstimgを取得できず、フェードアウトしない状態です。
76
+ ```php
77
+ <div class="first-img" >
78
+ <p><img src="<?php echo esc_url(get_template_directory_uri()); ?>/imgs/top/visual_bg.jpg" alt="r" id="firstimg"></p>
79
+ <span>
80
+ 美容専門のコンシェルジュが、<br>
81
+ 提供する「最高の美」
82
+ </span>
83
+ </div>
84
+ ```
85
+ ```js
86
+ function firstimg(){
87
+
88
+ $('.first-img p').fadeIn(500);
89
+ $('.first-img span').fadeIn(500);
90
+ };
91
+ setTimeout(firstimg, 10);
92
+ window.addEventListener('DOMContentLoaded', function(){
93
+ var img_elements = document.getElementById('firstimg');
94
+ for (var i = 0; i < img_elements.length; i++) {
95
+ img_elements[i].addEventListener('load', (e) => {
96
+ // function(){
97
+ // $('.first-img').fadeOut(1500);
98
+ // $('#main').fadeIn(800);
99
+ // }
100
+ console.log(" load");
101
+ });
102
+ img_elements[i].src = img_elements[i].getAttribute("src");
103
+ }
104
+ });
105
+ ```
106
+
107
+
75
108
  ### 補足情報
76
109
  visual_bg.jpg 751 × 1335 140KB