FlipClock iPhone扩展翻转标签内的数字

时间:2016-05-06 14:37:07

标签: javascript html ios iphone flipclock

我在页面上有一个FlipClock.js,可以在iPhone以外的所有设备和浏览器中完美显示。

在iPhone(4,4S,5,6)上,它会使用如下图所示的数字填充滚动标签。

有没有人遇到这个,也许可以建议一个链接来看看。现在有几个小时的试验错误,没有运气。谢谢!

enter image description here

时钟的相关HTML是:

    <div class="up">
      <div class="shadow"></div>
      <div class="inn">9</div>
    </div>
    <div class="down">
      <div class="shadow"></div>
      <div class="inn">9</div>
    </div>

我已使用固定字体大小定位.min类,但没有区别。它仅在iPhone上执行此操作,但在Chrome检查中不在iPhone模拟器中执行此操作。谢谢你的帮助!

1 个答案:

答案 0 :(得分:4)

我通过在一定宽度后更改字体的大小来解决这个问题。

&#13;
&#13;
@media screen and (max-width: 448px) {

	.flip-clock-wrapper ul li a div div.inn {
		font-size: 36px !important;
	}
}
&#13;
&#13;
&#13;