4

我有一个显示 javascript 倒计时的页面。javascript 会自动填充“d”表示天数，“h”表示数小时等... CSS 添加“ay(s)”、“our(s)”等...，如果空间允许，并将它们大写。

Javascript：

function cdtd(broadcast) {
    var nextbroadcast = new Date(broadcast);
    var now = new Date();
    var timeDiff = nextbroadcast.getTime() - now.getTime();
    if (timeDiff <= 0) {
        clearTimeout(timer);
        document.getElementById("countdown").innerHTML = "<a href=\"flconlineservices.php\">Internet broadcast in progress<\/a>";
        /* Run any code needed for countdown completion here */
    }
    var seconds = Math.floor(timeDiff / 1000);
    var minutes = Math.floor(seconds / 60);
    var hours = Math.floor(minutes / 60);
    var days = Math.floor(hours / 24);
    hours %= 24;
    minutes %= 60;
    seconds %= 60;
    document.getElementById("daysBox").innerHTML = days + " d";
    document.getElementById("hoursBox").innerHTML = hours + " h";
    document.getElementById("minsBox").innerHTML = minutes + " m";
    // seconds isn't in our html code (javascript error if this isn't commented out)
    /*document.getElementById("secsBox").innerHTML = seconds + " s";*/
    var timer = setTimeout('cdtd(broadcast)',1000);
}

CSS：

[role="navigation"] {text-transform:capitalize;}
@media screen and (min-width:1600px) {
    #countdown #daysBox:after {content:"ay(s)";}
    #countdown #hoursBox:after {content:"our(s)";}
    #countdown #minsBox:after {content:"inute(s)";}
}

Firefox 和 Opera 按我的预期显示倒计时（3 天、5 小时等），但 Internet Explorer 大写（3 天（S）、5 小时（S）等） ...）。Safari 和 Chrome 更糟糕，因为它们将 (s) 和 CSS 生成内容的首字母大写（3 DAy(S)、5 HOur(S) 等）。

我发现一个页面显示排版错误，其中 :first-letter 和 :first-line可能有些相关。

我试着做text-transform:lowercase然后text-transform:capitalize，但这并没有改变结果。

有想法该怎么解决这个吗？我可能会删除大写字母，但我必须确保所有内容都输入正确的大小写。

JJ

4

1 回答 1

1

好的，据我所知，您只需要天数、小时数和分钟数的第一个字母。您可以在 javascript 中执行此操作。就像是

var daysString = days + " d";
document.getElementById("daysBox").innerHTML = daysString.toUpperCase();

更新：忘了提我们的#countdown {text-transform:capitalize;}

于 2012-07-04T19:55:50.433 回答