|
текущее время с анимацией
возможно ли сделать идущие часы с эффектом счётчика ?
|
Besprizornik,
звучит как можно ли масло сделать масляным? не могли бы уточнить проблему. |
flipclock часы таймер секундометр
Besprizornik,
:-?
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/flipclock/0.7.8/flipclock.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/flipclock/0.7.8/flipclock.min.js"></script>
<script>
$(function() {
var clock = $('.your-clock').FlipClock({
clockFace: 'TwentyFourHourClock'
})
});
</script>
</head>
<body>
<div class="your-clock"></div>
</body>
</html>
|
Цитата:
(onload=function(){
var n, m;
n=59;
m=(n+"").match(/\d{1}/g);
|
Besprizornik,
не понимаю. |
рони,
возможно ли сделать чтобы каждая цифра из двухзначного числа была в отдельном div'е? |
Besprizornik,
а сейчас каждая цифра в отдельном li, что не устраивает? |
и потом применить подобную анимацию, только чуть другой эффект
position: absolute; top: -100%; opacity: 0.2 position: absolute; top: 0%; opacity: 1.0; position: absolute; 100%; opacity: 0.2; |
рони,
я имел ввиду простые часы с использованием методов объекта дата без внешних скриптов |
рони,
например в твоём скрипте
<style>
span.U_003A { color: #9c9c9c; }
#clock.x span.U_003A { color: #333399; }
</style>
<span id="clock"></span>
<script type="text/javascript">
function clock() {
var date = new Date();
var hour=date.getHours();
var minute=date.getMinutes();
var sec=date.getSeconds();
var day=date.getDate();
var month=date.getMonth();
var year=date.getFullYear();
var weekday=date.getDay();
var monthes=new Array ("января","февраля","марта","апреля","мая","июня","июля","августа","сентября","октября","ноября","декабря");
var dayNames = new Array("Воскресенье","Понедельник","Вторник","Среда","Четверг","Пятница","Суббота");
document.getElementById("clock").innerHTML = (hour<10?"0":"")+hour+" <span class='U_003A'>:</span> "+(minute<10?"0":"")+minute+" <span class='U_003A'>:</span> "+(sec<10?"0":"")+sec+"<br/>"+dayNames[weekday]+"<br/>"+(day<10?"0":"")+day+" "+monthes[month]+" "+year+" г.";
document.getElementById("clock").classList.toggle("x");
window.setTimeout("clock()",500);
}
clock();
</script>
|
| Часовой пояс GMT +3, время: 03:43. |
|