jqueryのスタイリッシュなカウントダウンタイマー”jquery-countdown”

jqueryの見た目がきれいなカウントダウンです。

 

〔必要なjavascript〕

 <script src="/js/jquery-1.6.4.min.js" type="text/javascript" charset="utf-8"></script><script src="js/jquery.countdown.js" type="text/javascript" charset="utf-8"></script><script type="text/javascript">
      $(function(){
        $('#counter').countdown({
          image: '/images/digits.png',
          startTime: '01:12:12:00'
        });
      });
    </script>

 

〔必要なcss〕

 <style type="text/css">
      br { clear: both; }
      .cntSeparator {
        font-size: 54px;
        margin: 10px 7px;
        color: #000;
      }
      .desc { margin: 7px 3px; }
      .desc div {
        float: left;
        font-family: Arial;
        width: 70px;
        margin-right: 65px;
        font-size: 13px;
        font-weight: bold;
        color: #000;
      }
    </style> 

 

〔必要なhtml〕

</p>
<div id="counter">&nbsp;</div>
<div class="desc">
	<div>D&iacute;as</div>
	<div>Horas</div>
	<div>Minutos</div>
	<div>Segundos</div>
</div>
<p>

 
Días
Horas
Minutos
Segundos

Copyright © All Rights Reserved · Green Hope Theme by Sivan & schiy · Proudly powered by WordPress