teratail
回答率
85.30%
teratail header banner
teratail header banner
質問するログイン新規登録
トップに関する質問TweenMaxを使用して文字をfadeInさせたい

編集履歴

質問編集履歴

5

編集

2017/11/27 08:12

投稿

narururu
narururu

スコア172

title CHANGED
File without changes
body CHANGED
@@ -52,25 +52,25 @@
52
52
  <div class="item active">
53
53
  <img src="images/slide1.jpg" alt="slide1" width="100%">
54
54
  <div class="carousel-caption">
55
- 古くから、<br>料理する場、<br>暖をとる場として<br>家族の中心に置かれてきた囲炉裏。
55
+ 文章
56
56
  </div>
57
57
  </div>
58
58
  <div class="item">
59
59
  <img src="images/slide2.jpg" alt="slide2" width="100%">
60
60
  <div class="carousel-caption">
61
- 鉄瓶にゆらゆらと立ち上る湯気、<br>時折ぱちぱちと爆ぜる炭を<br>眺めていると、<br>時間がゆっくり、ゆっくりと<br>流れていきます。
61
+ 文章
62
62
  </div>
63
63
  </div>
64
64
  <div class="item">
65
65
  <img src="images/slide3.jpg" alt="slide3" width="100%">
66
66
  <div class="carousel-caption">
67
- 囲炉裏を囲み、<br>家族が心の中から温まる、<br>そんな場所を作りたくて始めました。
67
+ 文章
68
68
  </div>
69
69
  </div>
70
70
  <div class="item">
71
71
  <img src="images/slide4.jpg" alt="slide4" width="100%">
72
72
  <div class="carousel-caption">
73
- １つ１つ丁寧に作られた囲炉裏は、<br>あなただけの、<br>世界にたった１つの作品となります。<br>是非、囲炉裏の持つ独自な趣を、<br>体感してください。
73
+ 文章
74
74
  </div>
75
75
  </div>
76
76
  </div>

4

コード修正

2017/11/27 08:12

投稿

narururu
narururu

スコア172

title CHANGED
File without changes
body CHANGED
@@ -10,11 +10,17 @@
10
10
  __main.js__
11
11
  ```
12
12
  $(function() {
13
- $(window).on("click",function() {
13
+ $(left carousel-control).on("click",function() {
14
14
  TweenMax.to("carousel-caption" , 1 , {autoAlpha:0});
15
15
  }
16
16
  });
17
17
  });
18
+ $(function() {
19
+ $(right carousel-control).on("click",function() {
20
+ TweenMax.to("carousel-caption" , 1 , {autoAlpha:0});
21
+ }
22
+ });
23
+ });
18
24
  ```
19
25
 
20
26
  ###現象

3

コードの修正

2017/11/25 06:52

投稿

narururu
narururu

スコア172

title CHANGED
File without changes
body CHANGED
@@ -10,9 +10,7 @@
10
10
  __main.js__
11
11
  ```
12
12
  $(function() {
13
- $(window).on("scroll",function() {
13
+ $(window).on("click",function() {
14
- var st = $(window).scrollTop();
15
- if (st > 100) {
16
14
  TweenMax.to("carousel-caption" , 1 , {autoAlpha:0});
17
15
  }
18
16
  });

2

コード修正

2017/11/25 04:51

投稿

narururu
narururu

スコア172

title CHANGED
File without changes
body CHANGED
@@ -9,7 +9,14 @@
9
9
  また、以下コードを記述しました。
10
10
  __main.js__
11
11
  ```
12
+ $(function() {
13
+ $(window).on("scroll",function() {
14
+ var st = $(window).scrollTop();
15
+ if (st > 100) {
12
- TweenLite.to("carousel-caption" , 1 , {autoAlpha:0});
16
+ TweenMax.to("carousel-caption" , 1 , {autoAlpha:0});
17
+ }
18
+ });
19
+ });
13
20
  ```
14
21
 
15
22
  ###現象

1

タグ、説明の追加

2017/11/25 04:50

投稿

narururu
narururu

スコア172

title CHANGED
File without changes
body CHANGED
@@ -11,6 +11,10 @@
11
11
  ```
12
12
  TweenLite.to("carousel-caption" , 1 , {autoAlpha:0});
13
13
  ```
14
+
15
+ ###現象
16
+ キャプションに入れてある文章がそのまま表示されている状態で、fadeInされません。
17
+
14
18
  ###ソースコード
15
19
  __index.html__
16
20
  ```
@@ -74,6 +78,8 @@
74
78
  </body>
75
79
  </html>
76
80
  ```
81
+
77
82
  上記の情報で何か分かりましたら、アドナイスいただけますでしょうか。
78
-
83
+ ↓公式サイト
84
+ https://greensock.com/tweenmax
79
85
  以上、よろしくお願いいたします。