Question

我想在html中制作横幅，其中图像根据白天时间而变化，即我希望在晚上7点到早上6点之间显示一个图像，而在其他时间显示其他图像。在搜索了wen后，我发现了website做了同样的事情。在此，图像根据系统的时间而变化，但我想根据世界时区改变图像。例如。我希望图像根据日本的时区改变。这是JS代码：

function pixTimeChange() {
  var t=new Date();
  var h = t.getHours();
  var r1="obanner1.jpg";
  var r2="poolside3.png";
  var el=document.getElementById('myimage');

  // See the time below. Note: The time is in 24 hour format.
  // In the example here, "7" = 7 AM; "17" =5PM.
  el.src = (h>=7 && h<16) ? r1 : r2;
}

// Multiple onload function created by: Simon Willison
// http://simonwillison.net/2004/May/26/addLoadEvent/
function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}

addLoadEvent(function() {
  pixTimeChange();
});

我对Javascript和jQuery的了解有限，需要帮助才能在此脚本中进行更改。对不起，如果这个问题超出了SO的范围。

Answer 1

查看this question获取时区。

然后使用JQuery，您可以为图像设置src参数，如下所示：

if (userIsInJapan) {
  $("#YourImgID").attr("src", r1);
}else{
  $("#YourImgID").attr("src", r2);
}

编辑：

我在this thread

中找到了有关如何检查时区的更多详细信息

我让this little example向您展示如何使用它

<script>

function calcTime(city, offset) {
    // create Date object for current location
    var d = new Date();

    // convert to msec
    // subtract local time zone offset
    // get UTC time in msec
    var utc = d.getTime() - (d.getTimezoneOffset() * 60000);

    // create new Date object for different city
    // using supplied offset
    var nd = new Date(utc + (3600000*offset));

    // return time as a string
    return "The local time for "+ city +" is "+ nd.toLocaleString();
}
// Refresh the timer every 250 milliseconds
setInterval(function(){
    $("#timeLabel").text(calcTime('Japan', '+6'));
}, 250)
</script>
<label id="timeLabel"></label>

根据世界时区改变图像？

1 个答案: