jQuery CSS3劳力士手表特效代码下载


jQuery CSS3劳力士手表特效代码下载
jQuery CSS3劳力士手表特效代码下载以及劳力士手表等js/jquery网页特效代码下载。

1. 引入CSS

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

2. 引入JS

<script src='js/jquery.min.js'></script>
<script src="js/script.js"></script>

3. HTML代码

<div class="rolex">
  <div class="band"></div>
  <div class="crown"></div>
  <div class="bezel"><i class="bez"></i><i class="bez"></i><i class="bez"></i><i class="bez"></i><i class="bez"></i><i class="bez"></i><i class="bez"></i><i class="bez"></i><i class="bez"></i><i class="bez"></i><i class="bez"></i><i class="bez"></i><i class="bez"></i><i class="bez"></i><i class="bez"></i>
    <div class="bezel-gradient"></div>
  </div><i class="bez-five-min"></i>
  <ul class="bez-num">
    <li>10</li>
    <li>20</li>
    <li>30</li>
    <li>40</li>
    <li>50</li>
  </ul>
  <div class="bezel-decor"><i class="bez-min"></i><i class="bez-min"></i><i class="bez-min"></i><i class="bez-min"></i><i class="bez-min"></i><i class="bez-min"></i><i class="bez-min"></i><i class="bez-min"></i><i class="bez-min"></i><i class="bez-min"></i><i class="bez-min"></i><i class="bez-min"></i><i class="bez-min"></i><i class="bez-min"></i>
  </div>
  <div class="crystal"></div>
  <div class="face">
    <div class="content-upper">
      <div class="logo">
        <div class="logo-left"></div>
        <div class="logo-right"></div>
      </div>
      <p class="name">Rolex</p>
      <p class="sub-name">Oyster Perpetual Date</p>
    </div>
    <div class="content-lower">
      <p class="sub-text">Submariner</p>
      <p class="sub-num">1000<em>ft</em> = 300<em>m</em></p>
      <p class="sub-fine">Superlative Chronometer<br/>Officially Certified</p>
      <p class="sub-swiss"><span>Chris</span> <span>made</span></p>
    </div><i class="sec"></i><i class="sec"></i><i class="sec"></i><i class="sec"></i><i class="sec"></i><i class="sec"></i><i class="sec"></i><i class="sec"></i><i class="sec"></i><i class="sec"></i><i class="sec"></i><i class="sec"></i><i class="sec"></i><i class="sec"></i><i class="sec"></i>
    <div class="marker-triangle"></div>
    <div class="marker-square"></div>
    <div class="marker-circle"><i class="markers-circle"></i><i class="markers-circle"></i><i class="markers-circle"></i><i class="markers-circle"></i>
    </div>
    <div class="date"></div>
    <div id="date-num"></div>
    <div class="hand-hour"><span><i class="hour-decor"></i></span></div>
    <div class="hand-min"><span></div>
    <div class="hand-sec">
      <div class="hand-sec-details"></div>
    </div>
  </div>
</div>

相关推荐

发表评论

相关文章