html+css+js Happy birthday website template （ Multi page version + music ）520/ Confession / Valentine's day on Chinese Valentine's day / Proposal dedicated cool animation web page source code （HTML5+CSS3+JS）

Programmer love 520/ Confession / Valentine's day on Chinese Valentine's day / Proposal only html5+css3+js Happy birthday website template
HTML Happy birthday blessing web page template , The template has a variety of dynamic renderings , The whole is decorated in blue , For birthday wishes to your girlfriend , Simple modification , That is, you can use web page generation to open .

Link below ↓ View the online presentation address

1. Happy birthday, ( Multi page html Templates )* Online demo address :https://ruanjiafeng2013.gitee.io/happy-birthday-template

2. Birthday cake * Online demo address :https://ruanjiafeng2013.gitee.io/birthday-cake

3.( Happy birthday, ) Cake fireworks + Blue dream ocean 3D Photo album * Online demo address : https://ruanjiafeng2013.gitee.io/birthday-cake520/

H5 Mobile terminal

One , The login page : account number / The codes are all 123 ( Customizable text and pictures + music )

Two , Birthday cake page ( Customizable text + music )

3、 ... and . Romantic confession page ( Customizable pictures + written words + music )

PC Computer terminal

The login page

Birthday cake page

Romantic confession page

Change Password

In the current directory , Yes js/index.js file ：

// Modify here 123,123 You can modify the login user name and password 
if(userName=="123" &&  pwd=="123"){
    
  event.preventDefault();
  $('form').fadeOut(500);
  $('.wrapper').addClass('form-success');
  setTimeout(function(){
    location.href="BirthdayCake.html";},2000);
}

Replace memories Page text and pictures

Take the third screen as an example ：

<!-- The third screen -->

<div class="section">
    <!--  The following two div The left axis and the ball realized respectively  -->
    <div class="timeline"></div>
    <div class="timepoint21"></div>
    <div class="ly-box21">
        <div class="ly-txt21">
            <!--  Change the date here  -->
            201X-1X-2X
        </div>
        <div class="ly-txt22">
          <!--  Change the content here , The paragraph 、 Line feed <p></p> Wrap it up  -->
           <p> XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</p>
           <p>XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</p>
        </div>
        <div class="ly-imgbox21">
          <!--  Change the picture here , Please change the corresponding name and put it in img Under the folder   If you don't understand css, Then it's best to cut the picture to the right size   If you will css, Then according to class Name to modify the corresponding css Set the width of the -->
          <img class="ly-img21" src="img/2014.11.26-1.png">
        </div>
    </div>
    <div class="ly-triangle21"></div>

    <div class="ly-box22">
        <div class="ly-txt23">
          <!--  Similar to the above , Don't say more  -->
            201X-1X-1X
        </div>
        <div class="ly-txt24">
            XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
        </div>
        <div class="ly-imgbox22">
          <img class="ly-img22" src="img/2014.12.19-1.png">
        </div>
    </div>
    <div class="ly-triangle22"></div>

     <div class="ly-box23">
        <div class="ly-txt25">
            201X-1X-2X
        </div>
        <div class="ly-txt26">
            XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
        </div>
        <div class="ly-imgbox23">
          <img class="ly-img23" src="img/2014.12.20-1.jpg">
        </div>
    </div>
    <div class="ly-triangle23"></div>
</div>

copy

baby , Your birthday is today , I wish you are still lovely , A lot of happiness ！ Maybe you weren't born for me , But I'm lucky to be with you . May I live , Light your birthday candle every year . A candle , A wish , A true love , happy birthday to you ！ beautiful days and nights with moon and flowers , picturesque . happy birthday to you 、 Cozy 、 Happiness …… May your birthday be filled with endless happiness , May your memories today be warm , May all your dreams be sweet , Wish you a happy year ！ On your birthday , I'm not with you , I just hope you can be happy 、 health 、 beautiful , Life needs struggle 、 Create and grasp ！ Happy birthday, ！ If there is a friend in the world , That is a friend who cares as much as you do for me . My best friend , Happy birthday , Good luck in the new year 、 health 、 happy ！ On this special day , I want to say I'm so happy , Time has not changed our friendship , I wish you a happy birthday. May blessings haunt you , In your colorful journey of life , In your dream of forever bordering spring . I wish you ： May all your wishes come true 、 Happy ！ The flowers are similar from year to year , People are different from year to year . Waking up is not a dream , The wrinkles between the eyebrows are again heavy . On your birthday , I just hope you are happy ！ Happy birthday, ! Always healthy ! Beautiful and moving ! May all happiness 、 All the happiness 、 All the warmth 、 All the good luck is around you . Happy birthday, ！ Happy birthday, ！ May this special day , Your every moment is full of joy . How time flies , Today is your birthday again , May you have all the beauty today , Next year's birthday will be better , One year is better than another . Happy birthday, ！ A greeting , A blessing , Everything is as you wish , A lifetime of happiness , I'm safe . Happy birthday ！ You and I have known each other for a long time ！ Unforgettable is the pure friendship between you and me ！ Precious is the eternal truth ！ Nice to meet you ！ Present my favorite carnation , Best wishes for your birthday . Life and love are the highest meaning of mankind . While trying to grasp life , May you find love soon ！ Happy birthday, ！ Today is your birthday , my lover , Thank you for your hard work , Thank you for your concern 、 Understand and support . Give you all my love ！ My sincere birthday wishes , profound friendship , I wish you in the coming year , May all your wishes come true ！ Happy birthday, , dear friend , May you be happy every day , Good luck every year , A lifetime of happiness ！

Good web effect , How to send links to others ?

1.1 Solve the deployment online ~> Deploy online tools ( Use for free forever )

1. You don't need to buy a server to deploy online , Your connection is accessible all over the world , Here is a necessary artifact for programmers ~
Plugins are integrated with super easy-to-use plug-ins , Download and install for free , Simple and easy to understand , It's an artifact ~ If necessary, it can be found in the article ↓ Xiagong Z Number acquisition

2. Is to do your code effect well , Deploy online , Send links to others , You can let the other party click in through your connection , You can see the effect of your web page , Both computer and mobile terminals are OK ! ( Otherwise, people will send files when they see your web page , The experience is not very good ~)

1.1 Deployment process

1.2 wow ~ Deployment success

wow ~ Deployment success ! Deploy your written page online , People all over the world can access your web page through links ( Free forever )~

---

front end Zero basis Entry to advanced ( video + Source code + Development software + Learning materials + Interview questions ) a full set of ( course )

Suitable for children's shoes from entry to advanced ~

---

* The source code for

* ~ Pay attention to me , Like the blog ~ Every day brings you knowledge !

* 1. See here, just [ give the thumbs-up + Praise + Collection ] Three even Support me , Yours 「 give the thumbs-up , Praise , Collection 」 It's the driving force of my creation .

* 2. Pay attention to me ~ Take you to study every day : Various front-end plug-ins 、3D Cool effect 、 Pictures show 、 Text effect 、 And the whole station template 、 College graduation template 、 Final assignment template 、 etc. ! 「 There are a lot of front end developer , To discuss front end Node knowledge , learn from each other 」！

* 3. We can learn from each other about the above technical issues , can Focus on ↓ Male Z Number Get more source code !

---

* More confession source code

100 Paragraph confession source code demonstration address