Есть много примеров того, как JavaScript реализует цифровые эффекты часов в Интернете, но эта статья знакомит вас с цифровыми часами с эффектами прокрутки. Редактор считает, что эффект очень впечатляет, поэтому я поделюсь им с вами ниже.
Давайте сначала посмотрим на ослепительные эффекты
Ниже приведен пример кода
Кодовая часть JavaScript:
window.onload = function () {function todou (n) {return n <10? "0"+n: ""+n;} var oimg = document.getelementsbytagname ("img"); setInterval (clock, 1000); clock function clock () {var ordate = new Date (); var Oh = odate.gethours ();); om = odate.getSeconds (); var str = todou (OH)+todou (of)+todou (om); for (var i = 0; i <oimg.length; i ++) {move (oimg [i], {"margintop":-35*str.charat (i)});}}}}}}}}}}}}}}}}}}}}Div+CSS Mayout Part:
<ul> <li> <img src = "img/num.png"/> </li> <li> <img src = "img/num.png"/> </li> <li>: </li> <li> <img src = "img/num.png"/> </li> <li> <img src = "num.png"/> </li> <li> /> </li> <li> <img src = "img/num.png"/> </li> </ul>*{Padding: 0; поля: 0; Список стиля: нет;} ul {ширина: 200px; Маржа: 100px Auto;} li {float: left; Высота: 35px; переполнение: скрыто; Линия-высота: 35px;}Суммировать
Выше приведено все примеры кодов о цифровых часах, которые используют JavaScript для достижения эффектов прокрутки. Код прост, но эффект очень хороший. Я надеюсь, что это может помочь вам.