coderFireflyHeng.github.io/old.html at master · coderFireflyHeng/coderFireflyHeng.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0"/>
    <link rel="stylesheet" href="css/swiper-3.3.1.min.css"/>
    <link rel="stylesheet" href="css/animate.min.css"/>
    <link rel="stylesheet" href="css/music.css">
    <link rel="stylesheet" href="css/old.css"/>
    <script type="text/javascript" src="js/jquery-1.11.2.js"></script>
    <script type="text/javascript" src="js/music.js"></script>
    <script type="text/javascript" src="js/swiper-3.3.1.jquery.min.js"></script>
    <script type="text/javascript" src="js/touch.js"></script>
    <script type="text/javascript" src="js/old.js"></script>
    <title>old</title>
</head>
<body>
<section class="swiper-container">
    <div class="swiper-wrapper">
        <div class="swiper-slide">
            <img src="images/old.jpg" alt="old" class="bg">
            <p class="title animate-active" set-tran="translateX(0%)" set-during-time="1500" set-animate="fadeIn 1s linear 0s 1" set-func="ease" set-delay="0">
                <span>当</span>
                <span>你</span>
                <span>老</span>
                <span>了</span>
            </p>
        </div>
        <div class="swiper-slide">
            <img src="images/oldbg.jpeg" alt="oldbg" class="bg">
            <img src="images/old1.jpg" alt="alone" class="sitalone  animate-active"    set-tran="scale(1)" set-during-time="2000" set-animate="fadeIn 1s linear 0s 1" set-func="ease" set-delay="0"  >
            <article class="gohome">
                <p class="animate-active"  set-tran="translateX(0%)" set-during-time="3000" set-animate="fadeIn 1s linear 0s 1" set-func="ease" set-delay="0">还记得你上一次回家的日子吗？</p>
                <p class="animate-active"   set-tran="translateX(0%)" set-during-time="3000" set-animate="fadeIn 1s linear 2000ms 1" set-func="ease" set-delay="3000">还记得你有多久没有和父母通电话？</p>
                <p class="animate-active"   set-tran="translateX(0%)" set-during-time="3000" set-animate="fadeIn 1s linear 3000ms 1" set-func="ease" set-delay="5000">还记得你有多久没有和父母在一起聊天？</p>
            </article>
        </div>
        <div class="swiper-slide">
            <img src="images/oldbg.jpeg" alt="oldbg" class="bg">
            <img src="images/phone.jpg" alt="oldcall"  class="oldphone animate-active"   set-tran="translateX(0%)" set-during-time="4000" set-animate="fadeIn 1s linear 0ms 1" set-func="ease" set-delay="0">
            <article  class="think animate-active"   set-tran="translateX(0%)" set-during-time="4000" set-animate="fadeIn 1s linear 0ms 1" set-func="ease" set-delay="0">
                老人拿着手机去店里维修，工作人员告诉他手机并没有坏。。。老人突然哭着说，那为什么我的孩子们不给我打电话？
            </article>
            <article  class="sad animate-active"   set-tran="translateX(0%)" set-during-time="4000" set-animate="fadeIn 1s linear 0ms 1" set-func="ease" set-delay="0">
                在为这个故事伤感之余，是否反思过，自己是不是故事的那个孩子？
            </article>
        </div>
        <div class="swiper-slide">
            <img src="images/oldbg.jpeg" alt="oldbg" class="bg">
            <img src="images/hand.jpg" alt="hand" class="hand">
            <article class="sign animate-active"   set-tran="translateY(0%)" set-during-time="4000" set-animate="fadeIn 1s linear 0ms 1" set-func="ease" set-delay="0">
                <span>牵</span>
                <span>手</span>
            </article>
            <article class="handin animate-active"  set-tran="translateX(10%)" set-during-time="3000" set-animate="fadeIn 4s linear 0ms 1" set-func="ease" set-delay="0">
                <span>多想和从前一样牵你温暖手掌</span>
                <span>可是你不在我身旁，托清风捎去安康</span></article>
        </div>
        <div class="swiper-slide">
            <img src="images/oldbg.jpeg" alt="oldbg" class="bg">
            <article class="end animate-active"   set-tran="translateY(-300%)" set-during-time="13000" set-animate="fadeIn 3s linear 0ms 1" set-func="ease" set-delay="0">
                为什么要孝敬父母，因为那是人性的根本，因为有一天我们也终将老去，乌鸦反哺，就是这么简单。<br/>不要等到，子欲养时，而亲却不待，就在此时，就在此刻，拿起你手中的电话，给父母一个问候，给他们一个温暖的拥抱，那就是最平凡的爱！
            </article>
        </div>
    </div>
    <div class="swiper-pagination"></div>
    <div class="upchange iconfont up"></div>

    <div id="music_container">
        <audio  id="playmusic"></audio>
        <div class="little1 animate-ele"><span class="animate-elea"></span></div>
        <div class="little2 animate-ele"><span class="animate-elea"></span></div>
        <div class="little3 animate-ele"><span class="animate-elea"></span></div>
        <div id="main" class="animate-ele">
        </div>
    </div>
</section>
</body>
</html>