Chapter 9 Adapter Mode-Explain in an easy-going way (Summary) JS

2023-01-09   ES  

This is one of the 100 websites in the programmer confession series, which aims to allow anyone to use and create their own confession website for the beloved. There are 100 confession websites in this wave, which can be modified and used arbitrarily. Many people want to confess to their beloved boys and girls. Even those who are shy are not dare to confess to their eyes. If you ca n’t say, use the webpage to tell TA ~ Make a confession webpage to tell TA your mind, demonstrate the following.

1 web page introduction: Based onHTML+CSS+JavaScript Make Qixi Valentine's Day Capital Page, Blessings, Tanabata Confession, Proposal, Romantic Love 3D Album, Cool Code, Come and make a high -end confession web page send (he/her) romantic confession. The production modification is simple. You can replace the background music by yourself, text and pictures to use

2. Web edit: Any HTML editing software (such as::Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++Waiting for any HTML editing software for operation and modifying editing).

The


code is as follows (example): The following only display some code for reference ~

<!--
 * @Author: your name
 * @Date: 2021-06-11 11:26:48
 * @LastEditTime: 2021-06-11 11:27:34
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \03\index.html
-->
<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link href="static/css/default.css" type="text/css" rel="stylesheet">
    <link href="static/css/audioAutoPlay.css" type="text/css" rel="stylesheet">
    <script type="text/javascript" src="static/js/jquery.js"></script>
    <script type="text/javascript" src="static/js/garden.js"></script>
    <script type="text/javascript" src="static/js/functions.js"></script>
    <title>xx, I love you</title>

    <body>
        <img id="music_ico" onclick="clickMusic()" src="static/image/music_ico.png" alt="">
        <audio id="audio" style="display: none;" src="static/music/bg_music.mp3" preload="auto" loop="loop"></audio>
        <div id="mainDiv">
            <div style="height: 100%">
                <div id="loveHeart">
                    <canvas id="garden"></canvas>
                    <div id="words">
                        <div id="messages">xx, this is the first we know<div id="elapseClock"></div>
                        </div>
                        <div id="loveu">I love you forever, for a lifetime, no separation!<br/>
                            <div class="signature">-The person who loves you the most</div>

                        </div>
                    </div>
                </div>

                <div id="code">
                    <span class="comments">XX:</span><br />
                    <span class="space" />
                    <span class="comments">I love you</span><br />
                    <span class="space" />
                    <span class="comments">Only in your smile can I have breathing, but also greedy your style, tempting your mystery, buried my love, the sentiment of the pulse is like a stream of spring water, and it is difficult to cut off the knife. Time is getting longer and longer, and my thoughts are getting deeper and deeper. I really want to find a silent late night or a sunny morning to talk to you in the heart and loneliness. 
 Our story is the most touching, most authentic, good morning, my eternal lover, although I have not got up yet, but my thoughts have already flew to your side. you. I want to sit on the lawn with moonlight, look at the night sky embellished by the stars, telling the ancient love myth of the world. Life is more lonely. Lonely life is full of love, loneliness is the eternal theme of love.</span><br />
                    <span class="space" />
                    <span class="comments">2, in the dark night without a moon, I sat alone in front of the window and wrote this letter, I hope to kiss you before going to bed; I hope I can hold you when I go to bed; I hope to wake up. Every day, everything is so beautiful, wind and sunny, flowers everywhere; days without you, the day is so dim, the night is so long. Your words have been locked in my memory, and you keep it for me for a lifetime. If you are cold, I will embrace you in my arms; if you cry, I will wipe the tears for you. You are like a cloud that wandering that day, and it is difficult for people to pursue it; you like the ping in the water, shift the Quartet, and make me difficult for me to think about it. Such a habit is also a sweet burden, missing you have long been an indispensable habit in my life. Missing is like a river. It flows to the sea and flows to my atrium. When I close my eyes, your figure appears in front of my eyes again. We walk side by side. We are the protagonist. We are the protagonist. After singing for so long, what is never changed is the deepening of love in my heart. If I have only one day of life, I will go to you and tell you that I am so attached to you. Our two hearts full of tenderness and intoxication are always together. I am willing to be the stars in heaven, give you eternal light, and always wait for you. I hope that every time you miss you, love you in the gap between breathing every second. I don't know why, as long as you are by my side, my heart is no longer uneasy. If you have you, you are everything, and everything is you without you. 
 I want to tell you that since you have you, I feel that the whole world is nodding at me. Your vibrant figure is always accompanied by the moonlight into my dream, letting me care about it. Remember our first encounter. At that moment, time was like still. Your temperament made me feel surprised. Knowing you and my life is full of vitality, and love with you and my life is full of passion.</span><br />
                    <span class="space" />
                    <span class="comments">2, keep a romantic story, give you a blessing, a KISS, love you forever! 
 Do you understand me? I am not mentally retarded, but I will love you stupidly forever. Some of them, I just want to get old with you, and you woven myths and create miracles, just because I meet you. Accept me, okay?</span><br />

                </div>


            </div>
        </div>
   
    </body>
    <script type="text/javascript" src="static/js/audioAutoPlay.js"></script>
    <script type="text/javascript" src="static/js/default.js"></script>
    <style>
    </style>

</html>




body {
    
    margin: 0;
    padding: 0;
    background: #ffe;
    font-size: 12px;
    overflow: auto
}

#mainDiv {
    
    width: 100%;
    height: 100%
}

#loveHeart {
    
    padding-left: 10%;
    float: none;
    margin: 10% auto;
    width: 670px;
    height: 625px
}

#garden {
    
    width: 100%;
    height: 100%
}

#elapseClock {
    
    text-align: right;
    font-size: 18px;
    margin-top: 10px;
    margin-bottom: 10px
}

#words {
    
    font-family: "sans-serif";
    width: 505px;
    font-size: 24px;
    color: #666
}

#messages {
    
    display: none
}

#elapseClock .digit {
    
    font-family: "digit";
    font-size: 36px
}

#loveu {
    
    padding: 5px;
    font-size: 22px;
    margin-top: 80px;
    margin-right: 120px;
    text-align: right;
    display: none
}

#loveu .signature {
    
    margin-top: 10px;
    font-size: 20px;
    font-style: italic
}

#code {
    
    float: none;
    margin: 0 auto;
    width: 440px;
    height: 400px;
    '' color: #333;
    font-family: "Consolas", "Monaco", "Bitstream Vera Sans Mono", "Courier New", "sans-serif";
    font-size: 18px;
}

#code .string {
    
    color: #2a36ff
}

#code .keyword {
    
    color: #7f0055;
    font-weight: bold
}

#code .placeholder {
    
    margin-left: 15px
}

#code .space {
    
    margin-left: 23px
}

#code .comments {
    
    color: palevioletred
}

#copyright {
    
    margin-top: 10px;
    text-align: center;
    width: 100%;
    color: #666
}

#errorMsg {
    
    width: 100%;
    text-align: center;
    font-size: 24px;
    position: absolute;
    top: 100px;
    left: 0
}

#copyright a {
    
    color: #666
}


When you see this, you will be [like, follow, collection] Three consecutive support. Your support is the driving force for my creation.

source

Related Posts

problems encountered in work in 2016 11-20

ntp time synchronization

nginx configuration webSocket long connection WS protocol

网 mask! How to divide the molecular network mask and calculate the IP address

Chapter 9 Adapter Mode-Explain in an easy-going way (Summary) JS

Random Posts

Spring configuration Context: Annotion-config description

Performance test and performance comparison with HIVE

jetbrains Family bucket start -up picture replacement method

Quickly entry OpenStack, brainless node deployment mitaka (4)-Glance deployment

Fast power (ordinary fast power, matrix fast power)