Diễn đàn Khám phá khoa học
Chào mừng đến Diễn đàn Khám phá khoa học
Bạn đang là khách viếng thăm. Vì vậy vui lòng đăng nhập hoặc đăng kí để sử dụng diễn đàn được tốt hơn và nhìn thấy được một số nội dung cần thiết

Khi tham gia vào diễn đàn bạn có thể viết bài, trao đổi kinh nghiệm, cùng khám phá với mọi người những điều hay, bổ ích về khoa học...,

Hãy chứng tỏ sự hiểu biết của bạn về Khoa học qua http://khampha.8forum.net
Diễn đàn Khám phá khoa học
Chào mừng đến Diễn đàn Khám phá khoa học
Bạn đang là khách viếng thăm. Vì vậy vui lòng đăng nhập hoặc đăng kí để sử dụng diễn đàn được tốt hơn và nhìn thấy được một số nội dung cần thiết

Khi tham gia vào diễn đàn bạn có thể viết bài, trao đổi kinh nghiệm, cùng khám phá với mọi người những điều hay, bổ ích về khoa học...,

Hãy chứng tỏ sự hiểu biết của bạn về Khoa học qua http://khampha.8forum.net
Diễn đàn Khám phá khoa học
Bạn có muốn phản ứng với tin nhắn này? Vui lòng đăng ký diễn đàn trong một vài cú nhấp chuột hoặc đăng nhập để tiếp tục.



 
Trang ChínhGalleryLatest imagesTìm kiếmĐăng kýĐăng Nhập

Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_t10Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_t12
 
ĐĂNG TIN
Các tin, bài báo thuộc về khoa học, thiên văn,...
 
Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_f12Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_f10
Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_t10Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_t12
 
Về các lĩnh vực Tin học, vật lý, toán học, thiên văn.....
 
Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_f12Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_f10
Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_t10Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_t12
 
Tài liệu, ebook, đề thi, phần mềm hữu ích, video, ảnh khoa học....
 
Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_f12Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_f10
Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_t10Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_t12
Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_f12Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Post_f10
Bookmark and Share|

Bộ đếm ngược thời gian tuyệt đẹp bằng javascript

Xem chủ đề cũ hơn Xem chủ đề mới hơn Go down
Tác giả
Bình chọn cho bài viết:
Admin
Administrator

Admin


Giới tính : Nam
Số bài gửi Số bài gửi : 388
Coin Coin : 19505
Được cám ơn : 23
Đến từ Đến từ : Việt Nam
Tài sản :
Bộ đếm ngược thời gian tuyệt đẹp bằng javascript AlligatorBộ đếm ngược thời gian tuyệt đẹp bằng javascript Iphone

Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Vide
Bộ đếm ngược thời gian tuyệt đẹp bằng javascript CS011092818_29781_1Sun Apr 24, 2011 9:38 am
Bài gửiTiêu đề: Bộ đếm ngược thời gian tuyệt đẹp bằng javascript

1) Chèn Css:
Code:
<style type="text/css">
html {
 background:#222;
 height:100%;
}
body {
 font:normal 76% verdana,tahoma,arial;color:#fff;
}
a {
 color:#99ffff;
}
a:hover {
 color:#ffff00;
}
h1, h2 {
 font:normal 1em georgia,helvetica,arial;
 letter-spacing:-0.5px; /* it isn't web 2.0 otherwise, right? ;) */
}
p {
 margin:0.5em 0px 1.25em 0px;
 padding:0px;
 line-height:1.7em;
}

/*COUNTER SPECIFIC STYLES */
.counter{
   width: 610px;
}
.counter ul.countdown{
   list-style-type: none;
   color: white;
   font-weight: bold;
   text-align: center;
}
.counter ul.countdown li{
   float: left;
   background: url(http://www.javascriptbank.com/javascript/time/Super_Neat_JavaScript_Countdown_Timer/digit.png) no-repeat;
   height:110px;
   width: 105px;
   padding-top: 15px;
}
.counter ul.countdown li div{
   font-size: 15px;
}
.counter ul.countdown li div.countdown_num{
   font-size: 48px;
}
.counter ul.countdown li.no_countdown{
   padding-top:4px;
   background:transparent;
   height:110px;
   width:180px;
}
</style>

2) Chèn vào nơi bạn muốn hiển thị, nhớ điều chỉnh lại thời gian cho phù hợp với yêu cầu của bạn:
Code:
<div id="counter" class="counter">
      <ul class="countdown">
         <li><div class="countdown_num" id="countdown_day"></div><div>Days</div></li>
         <li><div class="countdown_num" id="countdown_hour"></div><div>Hours</div></li>
         <li><div class="countdown_num" id="countdown_min"></div><div>Minutes</div></li>
         <li><div class="countdown_num" id="countdown_sec"></div><div>Seconds</div></li>
      </ul>
   </div>
   <div id="expired" style="display:none;">
      The deadline has passed.
   </div>
<script type="text/javascript">
   /*
      Countdown Timer
      Based on the "Count down until any date script" - By JavaScript Kit (www.javascriptkit.com)
      Author: (c) 2009 Elbert Bautista
      URL: http://www.egTheBlog.com
      Licence : Open Source MIT Licence

   */
   
   var current="Expired"
   var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")

   function countdown(yr,m,d){
      theyear=yr;themonth=m;theday=d
      var today=new Date()
      var todayy=today.getYear()
      if (todayy < 1000)
      todayy+=1900
      var todaym=today.getMonth()
      var todayd=today.getDate()
      var todayh=today.getHours()
      var todaymin=today.getMinutes()
      var todaysec=today.getSeconds()
      var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec
      futurestring=montharray[m-1]+" "+d+", "+yr
      dd=Date.parse(futurestring)-Date.parse(todaystring)
      dday=Math.floor(dd/(60*60*1000*24)*1)
      dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)
      dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)
      dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)
      if(dday==0&&dhour==0&&dmin==0&&dsec==1){
         document.getElementById('counter').style.display='none';
         document.getElementById('expired').style.display='block';
         return
      }
      else{
         document.getElementById('countdown_day').innerHTML=dday;
         document.getElementById('countdown_hour').innerHTML=dhour;
         document.getElementById('countdown_min').innerHTML=dmin;
         document.getElementById('countdown_sec').innerHTML=dsec;
         setTimeout("countdown(theyear,themonth,theday)",1000)
      }
   }

   var deadline=new Date();
   deadline.setDate(deadline.getDate()+5);
   var deadlineYear = deadline.getYear();
   if (deadlineYear < 1000)
   deadlineYear+=1900
   //enter the count down date using the format year/month/day
   countdown(deadlineYear, deadline.getMonth()+1, deadline.getDate());
   </script>

Demo:
Bộ đếm ngược thời gian tuyệt đẹp bằng javascript Mod310

Nguồn: javascriptbank.com

Về Đầu Trang Go down
http://www.diendan.khamphakhoahoc.tk

Bộ đếm ngược thời gian tuyệt đẹp bằng javascript

Xem chủ đề cũ hơn Xem chủ đề mới hơn Về Đầu Trang

Similar topics

+

****************Hãy cùng chia sẻ với bạn bè bằng cách ****************
Copy đường link dưới đây gửi đến nick yahoo bạn bè!

Trang 1 trong tổng số 1 trang

Permissions in this forum:Bạn không có quyền trả lời bài viết
Diễn đàn Khám phá khoa học :: Công nghệ thông tin :: Kiến thức :: Thiết kế web-
Diễn đàn Khám phá khoa học - Phát triển bởi các thành viên của diễn đàn.
Admin: Hồ Vũ Thảo Hiền
Liên hệ: Email: hvthhien@gmail.com hoặc info@khamphakhoahoc.tk | Yahoo chat: hvthhien
Ghi rõ nguồn diendan.khamphakhoahoc.tk khi sao chép bài ở đây!
Diễn đàn | Trang tin |Cửa hàng | Thành viên | Lịch | Game ngẫu nhiên | Nghe nhạc | Tìm kiếm | Hỏi đáp
Free forum | ©phpBB | Free forum support | Báo cáo lạm dụng | Thảo luận mới nhất