×

关注微信公众号

免备案网站空间虚拟主机双线空间域名查询PS数码后期
photoshop互助课堂数百G视频教程下载英语培训机构初中英语如何学随时随地聆听大师开讲/课堂
酷素材!视频教程打包下手绘教程抠图教程路径专辑photoshop cs3视频教程
查看: 3990|回复: 10

奥运会倒计时牌

[复制链接]
发表于 2008-6-9 20:55:22 | 显示全部楼层 |阅读模式
这是我在别人的网站上看到的,感觉不错。
就拿来大家一块学习一下。


<h3 rel="奥运倒计时牌"><a href="/apps/olympcd/?module_id=27000000009988">奥运倒计时牌</a></h3>
      
      </div>

      <div class="bd">
      <style>
                .ypolympcd{width:100%; background:url() center top no-repeat;height:250px; text-align:center;margin:0 auto}
                .ypolympcd .yp-ocwarpper{margin:0 auto; overflow:hidden;position:relative;width:248px;height:250px;}
                .ypolympcd .yp-ocwarpper .yp-oc-act,
                .ypolympcd .yp-ocwarpper .yp-oc-desc{display:block;width:82px; height:21px;overflow:hidden;position:absolute;top:208px;}
                .ypolympcd .yp-ocwarpper .yp-oc-act{background:url() center top no-repeat;left:30px;}
                .ypolympcd .yp-ocwarpper .yp-oc-desc{background:url() center bottom no-repeat;right:30px;}
                .ypolympcd .yp-oc-day,
                .ypolympcd .yp-oc-hour,
                .ypolympcd .yp-oc-min,
                .ypolympcd .yp-oc-sec{position:absolute;height:18px;line-height:18px; font-size:14px;overflow:hidden;font-weight:bold;color:#ff0000;font-family:Arial;top:163px;}
                .ypolympcd .yp-oc-day{left:28px;width:29px;}
                .ypolympcd .yp-oc-hour{left:80px;width:24px;}
                .ypolympcd .yp-oc-min{left:135px;width:24px;}
                .ypolympcd .yp-oc-sec{left:182px;width:24px;}
                .ypolympcd .yp-oc-today{position:absolute;height:32px;line-height:32px; font-size:18px;overflow:hidden;font-weight:bold;color:#000;top:22px;width:197px;left:24px;}
        </style>
        <div class="ypolympcd" id="yp-mod-27000000009988">
                <div class="yp-ocwarpper">
                        <div class="yp-oc-today"></div>
                        <div class="yp-oc-day"></div>
                        <div class="yp-oc-hour"></div>
                        <div class="yp-oc-min"></div>
                        <div class="yp-oc-sec"></div>
                </div>
        </div>
        <script type="text/javascript" src="http://cn.yui.yahooapis.com/2.4.1/build/utilities/utilities.js?_yuiversion=2.4.1"></script>
        <script type="text/javascript">
        (function(){
                YAHOO.namespace('CN.NCP.olymcd');
                YAHOO.CN.NCP.olymcd = function(){
                        var DifferenceHour = -1;
                        var DifferenceMinute = -1;
                        var DifferenceSecond = -1;
                        var diffTime = 0;
                        var Tday = new Date("Aug 8, 2008 20:00:00");
                        var daysms = 24 * 60 * 60 * 1000;
                        var hoursms = 60 * 60 * 1000;
                        var Secondms = 60 * 1000;
                        var microsecond = 1000;
                        var _D = YAHOO.util.Dom;
                        var _MODID = 'yp-mod-27000000009988';
                        var _E = YAHOO.util.Event;
                        var getTime = function(){
                                YAHOO.util.Connect.asyncRequest('post','/common/proxyer?url=http://mall.app.vip.cn3.yahoo.com/olympcd/time.php',{
                               
                                        success : function(o){
                                                var r = eval('('+o.responseText+')');
                                                var clientTime = new Date().getTime();
                                                diffTime = new Date(r.time).getTime()-clientTime;
                                                ocd();
                                        },
                                        failure : function(){
                                                ocd();
                                        }
                                });
                        };
                        function ocd()
                        {
                                if(!_D.inDocument(_MODID)){return;}
                                var newTime = new Date().getTime()+diffTime;
                                var time = new Date(newTime);
                               
                                var tday = time.getDate();   
                                var tmonth = time.getMonth() + 1;
                                var hour = time.getHours();
                                var minute = time.getMinutes();
                                var second = time.getSeconds();
                                var timevalue = ""+((hour > 12) ? hour-12:hour);
                                timevalue +=((minute < 10) ? ":0":":")+minute;
                                timevalue +=((second < 10) ? ":0":":")+second;
                                timevalue +=((hour >12 ) ? " PM":" AM");
                                var convertHour = DifferenceHour;
                                var convertMinute = DifferenceMinute;
                                var convertSecond = DifferenceSecond;
                                var Diffms = Tday.getTime() - time.getTime();
                                DifferenceHour = Math.floor(Diffms / daysms);
                                Diffms -= DifferenceHour * daysms;
                                DifferenceMinute = Math.floor(Diffms / hoursms);
                                Diffms -= DifferenceMinute * hoursms;
                                DifferenceSecond = Math.floor(Diffms / Secondms);
                                Diffms -= DifferenceSecond * Secondms;
                                var dSecs = Math.floor(Diffms / microsecond);
                                if(convertHour != DifferenceHour) _D.getElementsByClassName('yp-oc-day', 'div', _MODID)[0].innerHTML=DifferenceHour;
                                if(convertMinute != DifferenceMinute) _D.getElementsByClassName('yp-oc-hour', 'div', _MODID)[0].innerHTML=DifferenceMinute;
                                if(convertSecond != DifferenceSecond) _D.getElementsByClassName('yp-oc-min', 'div', _MODID)[0].innerHTML=DifferenceSecond;
                                _D.getElementsByClassName('yp-oc-sec', 'div', _MODID)[0].innerHTML=dSecs;
                                _D.getElementsByClassName('yp-oc-today', 'div', _MODID)[0].innerHTML= '今天是2008年'+tmonth+'月'+tday+'日';
                                var ocdtimer = setTimeout(ocd, 1000);
                                if(DifferenceHour == 0 && DifferenceMinute == 0 && DifferenceSecond== 0 && dSecs==0){
                                        clearTimeout(ocdtimer);
                                }
                        }
                        _E.onContentReady(_MODID, getTime);
                };
                YAHOO.util.Event.on(window, 'load', YAHOO.CN.NCP.olymcd);
        })();
        </script>

      </div>

[ 本帖最后由 Joasea 于 2008-6-9 21:02 编辑 ]
发表于 2017-8-25 13:18:55 | 显示全部楼层
好帖就是要顶
回复 支持 反对

使用道具 举报

发表于 2017-8-25 12:26:13 | 显示全部楼层
很好哦。。。
回复 支持 反对

使用道具 举报

发表于 2017-8-25 12:52:20 | 显示全部楼层
LZ真是人才
回复 支持 反对

使用道具 举报

发表于 2017-8-25 12:34:24 | 显示全部楼层
学习了。。。
回复 支持 反对

使用道具 举报

发表于 2017-8-25 13:00:09 | 显示全部楼层
楼主我支持你
回复 支持 反对

使用道具 举报

发表于 2018-9-24 20:45:52 | 显示全部楼层
很不错。。。
回复 支持 反对

使用道具 举报

发表于 2018-9-24 21:28:48 | 显示全部楼层
真心顶。。。。
回复 支持 反对

使用道具 举报

发表于 2018-9-24 21:13:12 | 显示全部楼层
不错不错
回复 支持 反对

使用道具 举报

发表于 2018-9-24 21:09:23 | 显示全部楼层
LZ真是人才
回复 支持 反对

使用道具 举报

发表于 2018-9-24 21:26:40 | 显示全部楼层
好帖子要收藏
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | [免费注册]

本版积分规则