页面的head部分，需引入页面元素的样式文件，代码如下：

<link type="text/css" rel="stylesheet" href="css/style.css"/>

页面的body部分，需设置好日历和弹窗的div容器，部分代码如下：

<h1>jQuery带弹窗事件的日历</h1>
<section id="modal">
  <div class="wrapper">
    <div class="content">
      <div class="close"></div>
      <div class="box"></div>
    </div>
  </div>
</section>
<section id="calendar" class="collectonme">
  <div id="day-labels">
    <div class="label">Sun</div>
    <div class="label">Mon</div>
    <div class="label">Tue</div>
    <div class="label">Wed</div>
    <div class="label">Thu</div>
    <div class="label">Fri</div>
    <div class="label">Sat</div>
  </div>
  <div id="one" class="week">
    <div class="day noDate"></div>
    <div class="day noDate"></div>
    <div class="day">
      <span class="date">1</span>
      <div class="surprise">
        <h2>A Hilarious Design Classic</h2>
        <p>For your first day, I present for your reading pleasure a wonderful classic comic by the incomparable Matthew Inman (aka The Oatmeal).</p>
        <a class="button" href="https://jy.tp.yuanmeng.life/" target="_blank">Read On</a>
      </div>
      
    </div>
    <div class="day">
      <span class="date">2</span>
      <div class="surprise">
        <h2>For Your Second Day, Some Humor</h2>
        <p>A user interface is like a joke. If you have to explain it, chances are it's not that good.</p>
      </div>
    </div>

页面的底部，需引入jQuery库和其他两个JS文件，代码如下：

<script type="text/javascript" src='js/jquery.min.js'></script>
<script type="text/javascript" src='js/snowfall.jquery.min.js'></script>
<script type="text/javascript" src="js/index.js"></script>