我的页面上有一个工作倒计时自动收录器，它使用了javascript（我找到了一个模板/没有自己编写代码）。我把它放在一个在中型到大型显示器上看起来很好的方式，但我试图让它在移动尺寸显示器中正确显示。我认为这样做的一个好方法是创建第二个相同的自动收报机，并将其正确放置在移动尺寸显示中，并在必要时使用引导类隐藏/显示代码。当页面加载时，但是大显示器上的自动收报机正在工作，但是当我将窗口缩小到小尺寸时，第二个自动收报机将正确显示但是javascript和功能不起作用/数字的图像将不会显示。也许我可以使用一个可以某种方式改变移动屏幕尺寸位置的自动收报机？
以下是工作代码的代码：
有一个身体上传功能：
<body onload="countdown(year,month,day,hour,minute)">
以下是将代码添加到页面正文的代码：
<div id="holder" class="hidden-xs">
<div id="timer">
<div id="note"></div>
<div id="countdown">
<img height=21 src="digital-numbers/bkgd.gif" width=16 name="day1">
<img height=21 src="digital-numbers/bkgd.gif" width=16 name="day2">
<img height=21 src="digital-numbers/bkgd.gif" width=16 name="day3">
<img height=21 id="colon1" src="digital-numbers/colon.png" width=9 name="d1">
<img height=21 src="digital-numbers/bkgd.gif" width=16 name="h1">
<img height=21 src="digital-numbers/bkgd.gif" width=16 name="h2">
<img height=21 id="colon2" src="digital-numbers/colon.png" width=9 name="g1">
<img height=21 src="digital-numbers/bkgd.gif" width=16 name="m1">
<img height=21 src="digital-numbers/bkgd.gif" width=16 name="m2">
<img height=21 id="colon3" src="digital-numbers/colon.png" width=9 name="j1">
<img height=21 src="digital-numbers/bkgd.gif" width=16 name="s1">
<img height=21 src="digital-numbers/bkgd.gif" width=16 name="s2">
<div id="title">
<div class="title" style="position: absolute; top: 36px; left: 42px">DAYS</div>
<div class="title" style="position: absolute; top: 36px; left: 105px">HRS</div>
<div class="title" style="position: absolute; top: 36px; left: 156px">MIN</div>
<div class="title" style="position: absolute; top: 36px; left: 211px">SEC</div>
</div>
</div>
</div>
这是JS：
<script type="text/javascript">
/*
Count down until any date script-
By JavaScript Kit (www.javascriptkit.com)
Over 200+ free scripts here!
Modified by Robert M. Kuhnhenn, D.O.
(www.rmkwebdesign.com/Countdown_Timers/)
on 5/30/2006 to count down to a specific date AND time,
on 10/20/2007 to a new format, on 1/10/2010 to include
time zone offset, and on 7/12/2012 to digital numbers.
*/
/*
CHANGE THE ITEMS BELOW TO CREATE YOUR COUNTDOWN TARGET DATE AND ANNOUNCEMENT
ONCE THE TARGET DATE AND TIME ARE REACHED.
*/
var note="Warrior Games 2015 Have Arrived!"; /* -->Enter what you want the script to
display when the target date and time
are reached, limit to 25 characters */
var year=2015; /* -->Enter the count down target date YEAR */
var month=06; /* -->Enter the count down target date MONTH */
var day=19; /* -->Enter the count down target date DAY */
var hour=0; /* -->Enter the count down target date HOUR (24 hour clock) */
var minute=0; /* -->Enter the count down target date MINUTE */
var tz=-4; /* -->Offset for your timezone in hours from UTC (see
http://wwp.greenwichmeantime.com/index.htm to find
the timezone offset for your location) */
//--> DO NOT CHANGE THE CODE BELOW! <--
d1 = new Image(); d1.src = "digital-numbers/1.png";
d2 = new Image(); d2.src = "digital-numbers/2.png";
d3 = new Image(); d3.src = "digital-numbers/3.png";
d4 = new Image(); d4.src = "digital-numbers/4.png";
d5 = new Image(); d5.src = "digital-numbers/5.png";
d6 = new Image(); d6.src = "digital-numbers/6.png";
d7 = new Image(); d7.src = "digital-numbers/7.png";
d8 = new Image(); d8.src = "digital-numbers/8.png";
d9 = new Image(); d9.src = "digital-numbers/9.png";
d0 = new Image(); d0.src = "digital-numbers/0.png";
bkgd = new Image(); bkgd.src = "digital-numbers/bkgd.gif";
var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec" );
function countdown(yr,m,d,hr,min){
theyear=yr;themonth=m;theday=d;thehour=hr;theminute=min;
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 todaystring1=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec;
var todaystring=Date.parse(todaystring1)+(tz*1000*60*60);
var futurestring1=(montharray[m-1]+" "+d+", "+yr+" "+hr+":"+min);
var futurestring=Date.parse(futurestring1)-(today.getTimezoneOffset()*(1000*60));
var dd=futurestring-todaystring;
var dday=Math.floor(dd/(60*60*1000*24)*1);
var dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1);
var dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1);
var dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1);
if(dday<=0&&dhour<=0&&dmin<=0&&dsec<=0){
document.getElementById('note').innerHTML=note;
document.getElementById('note').style.display="block";
document.getElementById('countdown').style.display="none";
clearTimeout(startTimer);
return;
}
else {
document.getElementById('note').style.display="none";
document.getElementById('timer').style.display="block";
startTimer = setTimeout("countdown(theyear,themonth,theday,thehour,theminute)",500);
}
convert(dday,dhour,dmin,dsec);
}
function convert(d,h,m,s) {
if (!document.images) return;
if (d <= 9) {
document.images.day1.src = bkgd.src;
document.images.day2.src = bkgd.src;
document.images.day3.src = eval("d"+d+".src");
}
else if (d <= 99) {
document.images.day1.src = bkgd.src;
document.images.day2.src = eval("d"+Math.floor(d/10)+".src");
document.images.day3.src = eval("d"+(d%10)+".src");
}
else {
document.images.day1.src = eval("d"+Math.floor(d/100)+".src");
var day = d.toString();
day = day.substr(1,1);
day = parseInt(day);
document.images.day2.src = eval("d"+day+".src");
document.images.day3.src = eval("d"+(d%10)+".src");
}
if (h <= 9) {
document.images.h1.src = d0.src;
document.images.h2.src = eval("d"+h+".src");
}
else {
document.images.h1.src = eval("d"+Math.floor(h/10)+".src");
document.images.h2.src = eval("d"+(h%10)+".src");
}
if (m <= 9) {
document.images.m1.src = d0.src;
document.images.m2.src = eval("d"+m+".src");
}
else {
document.images.m1.src = eval("d"+Math.floor(m/10)+".src");
document.images.m2.src = eval("d"+(m%10)+".src");
}
if (s <= 9) {
document.images.s1.src = d0.src;
document.images.s2.src = eval("d"+s+".src");
}
else {
document.images.s1.src = eval("d"+Math.floor(s/10)+".src");
document.images.s2.src = eval("d"+(s%10)+".src");
}
}
</script>