Usando HTML5, CSS para obter o efeito do pêndulo
Ponto de conhecimento:1) Use a posição/esquerda/topo e calc () para atingir o nível e o centro vertical dos elementos;
2) Use a animação de definição de definição de definição de atributo de atributo de atributo do CSS3;
3) Use a origem de transformação para realizar o ajuste do coração redondo da origem da rotação
Não diga muita bobagem, olhe diretamente para o código, o código específico é mostrado abaixo:
<! Calc (50% -200px); Esquerda: Calcário (50% -100px); 0: 0: 0: 0: 0: 0: 0: 0: 0:; girate (30deg);} .ange60 {transform: 60deg); {Transform: gire (180DEG);} .ange210 {Transs Form: girar (210deg);}. 300DEG);}. Bordado de fundo -Color: ORIGEM: 50% de 60px; ; <Body> <div id> <div id = 'dial'> <ul id = scale> <li class = scaleIndEx> </li> <li class = scaleIndindex angle30> </li> <li class = scaleIndex angle60> < /li> <li class = scaleIndex angle90> </l i> <li class = scaleIndex angle120> </li> <li class = scaleIndex angle150> </li> <li class = scaleIndex angle180> </li> <classe li = ScaleIndex angle210> </li> class = scaleIndindex angle240> </li> <li class = scaleIndindex angle270> </li> <li class = scaleIndex angle300> </li> <li class = scaleIndEx ângulo330> </li> </ul> <div id = fixpoint> </div> <div id = hourHand> </div> <div id = minutehand> </div> <div id = SecondHand> </div> </div> <script Type = 'text/javascript' src = 'js/jQuery-3.2.1.js'> </script> <script type = text/javascript> window.onload = function () {var househand = document.getElementById ('hourHandhand '); ; 60 * 360 + deg '; ')') '}); }); + ')';Resumir
O acima é o efeito de relógio simples com base no HTML5+CSS3 que eu introduziu para você. Muito obrigado pelo seu apoio ao site VevB Wulin!