首页 > 教程 > 网页特效源码

    收藏

    JS实现倒计时功能
    DT模板2016-09-16网页特效源码61℃
    广告
    核心提示:页面代码div class=time class=id=onBidtime125 pid=125 div class=timeicon /div 距离结束:span class=day-/span 天 span class=hour-/span 小时 span class=minute-/span 分 span class=second-/span 秒 script type=text/javascript $(function(){ endDown2(1472287680,1470660651,#onB


    页面代码
    <div class="time " class="" id="onBidtime125" pid="125">
    <div class="timeicon" ></div>
    距离结束:<span class="day">-</span> 天 <span class="hour">-</span> 小时 <span class="minute">-</span> 分 <span class="second">-</span> 秒
    <script type="text/javascript">
    $(function(){
    endDown2("1472287680","1470660651","#onBidtime125","#onBidtime125 .day","#onBidtime125 .hour","#onBidtime125 .minute","#onBidtime125 .second");
    });
    </script>
    </div>
    JS代码
    // 结束倒计时
    //etime 结束时间
    //ntime 服务器时间
    function endDown2(etime,ntime,boxobj,day_elem,hour_elem,minute_elem,second_elem)
    var now_time = new Date(ntime*1000);
    var end_time = new Date(etime*1000);
    var sys_second = (end_time-now_time)/1000;
    var timer = setInterval(function(){
    if (sys_second > 0) {
    sys_second -= 1;
    var day = Math.floor((sys_second / 3600) / 24);
    var hour = Math.floor((sys_second / 3600) % 24);
    var minute = Math.floor((sys_second / 60) % 60);
    var second = Math.floor(sys_second % 60);
    day_elem && $(day_elem).text(day);//计算天
    $(hour_elem).text(hour<10?"0"+hour:hour);//计算小时
    $(minute_elem).text(minute<10?"0"+minute:minute);//计算分
    $(second_elem).text(second<10?"0"+second:second);// 计算秒
    } else {
    clearInterval(timer);
    $('#bidTimeStatus').remove();
    $(boxobj).html('');
    $(boxobj).addClass('end');
    }
    }, 1000);
    }
    // 开始倒计时
    function startDown2(etime,ntime,boxobj,day_elem,hour_elem,minute_elem,second_elem){
    var now_time = new Date(ntime*1000);
    var end_time = new Date(etime*1000);
    var sys_second = (end_time-now_time)/1000;
    var timer = setInterval(function(){
    if (sys_second > 0) {
    sys_second -= 1;
    var day = Math.floor((sys_second / 3600) / 24);
    var hour = Math.floor((sys_second / 3600) % 24);
    var minute = Math.floor((sys_second / 60) % 60);
    var second = Math.floor(sys_second % 60);
    day_elem && $(day_elem).text(day);//计算天
    $(hour_elem).text(hour<10?"0"+hour:hour);//计算小时
    $(minute_elem).text(minute<10?"0"+minute:minute);//计算分
    $(second_elem).text(second<10?"0"+second:second);// 计算秒
    } else {
    $('.noStartBidTbox .th').html('拍卖已开始');
    $(boxobj).html('');
    $(boxobj).addClass('into');
    }
    }, 1000);
    }
    需要时时与服务器同步时间JS代码
    function endDown(etime,ntime,boxobj,day_elem,hour_elem,minute_elem,second_elem,msec_elem){
    var now_time = new Date(ntime*1000);
    var end_time = new Date(etime*1000);
    var native_time = new Date().getTime(); //本地时间
    var now_cha = now_time - native_time; //服务器和本地时间差
    var native_end_time = end_time - now_cha; //本地结束时间
    var sys_second = 0;
    var bidpids = $(boxobj).attr('pid');
    if(bidpids){
    var bidpid = bidpids;
    }
    endDowntimer = setInterval(function(){
    // 检查本地时间是否更改
    if(Math.abs(native_time - new Date().getTime())>1000){
    clearInterval(endDowntimer);
    $.post(ajaxGetTime, {'pid':bidpid},function(data){
    endDown(data.endtime,data.nowtime,boxobj,day_elem,hour_elem,minute_elem,second_elem,msec_elem);
    });
    }
    sys_second = (native_end_time - new Date().getTime())/100; //本地结束剩余时间
    if (sys_second > 0) {
    sys_second -= 1;
    var day = Math.floor((sys_second / 36000) / 24);
    var hour = Math.floor((sys_second / 36000) % 24);
    var minute = Math.floor((sys_second / 600) % 60);
    var second = Math.floor((sys_second/10) % 60);
    var msec = Math.floor(sys_second % 10); //毫秒
    day_elem && $(day_elem).text(day);//计算天
    $(hour_elem).text(hour<10?"0"+hour:hour);//计算小时
    $(minute_elem).text(minute<10?"0"+minute:minute);//计算分
    $(second_elem).text(second<10?"0"+second:second);// 计算秒
    $(msec_elem).text(msec);// 计算秒的1/10
    native_time = new Date().getTime();
    } else {
    clearInterval(endDowntimer);
    // 本地时间结束提交服务器验证是否结束
    $.post(ajaxCheckSucc, {'pid':bidpid},function(data){
    if(data.status==0){
    // startDown(data.end_time,data.now_time,".noStartTime",".noStartTime .day",".noStartTime .hour",".noStartTime .minute",".noStartTime .second",".noStartTime .msec");
    endDown(data.end_time,data.now_time,boxobj,day_elem,hour_elem,minute_elem,second_elem,msec_elem);
    }else{
    if(data.status==1){
    $('#bidTimeStatus').remove();
    $(boxobj).html('');
    $(boxobj).addClass('end');
    var user = data.nickname;
    if(data.uid==userid){user ='您';}
    var msg = '恭喜'+user+'以'+data.money+'元,拍到《'+data.pname+'》';
    }else if (data.status==2){
    var msg = '《'+data.pname+'》未达到保留价,流拍!'
    }
    popup.success(msg,'结束提示',function(action){
    //success 返回两个 action 值,分别是 'ok' 和 'close'。
    if(action == 'ok'){
    window.top.location.reload();
    }
    if(action == 'close'){
    window.top.location.reload();
    }
    });
    }
    });
    }
    }, 100);
    }
    // 开始时间倒计时
    function startDown(etime,ntime,boxobj,day_elem,hour_elem,minute_elem,second_elem,msec_elem){
    var now_time = new Date(ntime*1000);
    var end_time = new Date(etime*1000);
    var native_time = new Date().getTime(); //本地时间
    var now_cha = now_time - native_time; //服务器和本地时间差
    var native_end_time = end_time - now_cha; //本地结束时间
    var sys_second = 0;
    var bidpids = $(boxobj).attr('pid');
    if(bidpids){
    var bidpid = bidpids;
    }
    startDowntimer = setInterval(function(){
    if(Math.abs(native_time - new Date().getTime())>1000){
    clearInterval(startDowntimer);
    $.post(ajaxGetTime, {'pid':bidpid},function(data){
    startDown(data.endtime,data.nowtime,boxobj,day_elem,hour_elem,minute_elem,second_elem,msec_elem);
    });
    }
    sys_second = (native_end_time - new Date().getTime())/100; //本地结束剩余时间
    if (sys_second > 0) {
    sys_second -= 1;
    var day = Math.floor((sys_second / 36000) / 24);
    var hour = Math.floor((sys_second / 36000) % 24);
    var minute = Math.floor((sys_second / 600) % 60);
    var second = Math.floor((sys_second/10) % 60);
    var msec = Math.floor(sys_second % 10); //毫秒
    day_elem && $(day_elem).text(day);//计算天
    $(hour_elem).text(hour<10?"0"+hour:hour);//计算小时
    $(minute_elem).text(minute<10?"0"+minute:minute);//计算分
    $(second_elem).text(second<10?"0"+second:second);// 计算秒
    $(msec_elem).text(msec);// 计算秒的1/10
    native_time = new Date().getTime();
    } else {
    $('.noStartBidTbox .th').html('拍卖已开始');
    $(boxobj).html('');
    $(boxobj).addClass('into');
    window.top.location.reload();
    }
    }, 100);
    }
 
  • 文本链接:https://mbtxw.com/Course/show.php?itemid=86
  • 文章来源:模板模板
  • 版权声明:除非特别标注,否则均为本站原创文章,转载时请以链接形式注明文章出处。
0相关评论