У меня есть таймер, но я не могу настроить его размещение, как?

Question

IninsaY @IninsaY

HTML

У меня есть таймер, но я не могу настроить его размещение, как?

<html>
  <head>
    <meta charset="UTF-8">  
    <title>Название</title>
    <link rel="stylesheet" href="style.css">
    <script type="text/javascript" src="index.js"></script>
    <script class="a11" src="//megatimer.ru/get/ba40f8b36c284523e3ef684a5f5bee02.js"></script>
  </head>
  <body>
    <div class="a1">
      <h1 class="a2">COMING SOON</h1>
      <p class="a3">SUBCRIBE TO GET NOTIFED ON UPDATES</p>
    </div>
    <div>
       <form action="input1.php" name="test" method="post" class="a4">
        <input class="a5" type="email" name="email" placeholder="Type your e-mail adress">
        <input class="a6" type="submit" value="Subscribe">
      </form>
    </div>
    <div class="a8">
      <canvas id="circle1" width="100" height="100">
       <p>Ваш браузер не поддерживает рисование.</p>
     </canvas>
    </div>
    <div class="a9">
       <canvas id="circle2" width="100" height="100">
        <p>Ваш браузер не поддерживает рисование.</p>
       </canvas>
    </div>
    <div class="a10">
      <canvas id="circle3" width="100" height="100">
        <p>Ваш браузер не поддерживает рисование.</p>
     </canvas>
    </div>
    <div class="a7">
      <h1>DAYS HOURS MINS</h1>
    </div>
  </body>
</html>

Вопрос задан более трёх лет назад
27 просмотров

Комментировать

Подписаться 1 Средний Комментировать

Пригласить эксперта

Ответы на вопрос 1

1 комментарий

IninsaY @IninsaY Автор вопроса

Я понял вашу задумку, но я пока не начал учить js, если вам не сложно, можете запихнуть в канвас таймер? Буду очень благодарен.

<html>
  <head>
    <meta charset="UTF-8">  
    <title>Название</title>
    <link rel="stylesheet" href="style.css">
    <script type="text/javascript" src="canvas.js"></script>
    <script class="a11" src="Таймер.js"></script>
  </head>
  <body>
    <div class="a1">
      <h1 class="a2">COMING SOON</h1>
      <p class="a3">SUBCRIBE TO GET NOTIFED ON UPDATES</p>
    </div>
    <div>
       <form action="input1.php" name="test" method="post" class="a4">
        <input class="a5" type="email" name="email" placeholder="Type your e-mail adress">
        <input class="a6" type="submit" value="Subscribe">
      </form>
    </div>
    <div class="a8">
      <canvas id="circle1" width="100" height="100">
       <p>Ваш браузер не поддерживает рисование.</p>
     </canvas>
    </div>
    <div class="a9">
       <canvas id="circle2" width="100" height="100">
        <p>Ваш браузер не поддерживает рисование.</p>
       </canvas>
    </div>
    <div class="a10">
      <canvas id="circle3" width="100" height="100">
        <p>Ваш браузер не поддерживает рисование.</p>
     </canvas>
    </div>
    <div class="a7">
      <h1>DAYS HOURS MINS</h1>
    </div>
  </body>
</html>

body {
  background: url(img/bg.jpg) no-repeat center center fixed;
  -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
}
.a1 {
  height: 300px;
}

.a2 {
  font-size: 50px;
  font-family: Bold;
  color: white;
  text-align: center;
  line-height: 0.5em;
  margin-top: 125px;
}

.a3 {
  color: darkblue;
  text-align: center;
  font-family: Bold;
  line-height: 0em;
}

.a4 {
  margin-left: 630px;
  margin-top: -220px;
  size: 500px;
}

.a5 {
  width: 180px;
  height: 30px;
}

.a6 {
  background-color: orange;
  color: white;
  border-color: orange;
  height: 35px;
}

.a7 {
  font-size: 15px;
  color: white;
  font-family: Bold;
  margin-left: 610px;
  margin-top: 300px;
  word-spacing: 25px;
  position: relative;
}

.a8 {
  margin-left: 570px;
  margin-top: 200px;
}

.a9 {
  margin-left: 700px;
  margin-top: -100px;
}

.a10 {
  margin-left: 830px;
  margin-top: -100px;
}
.a11 {
  margin-top: -280px;
}

window.addEventListener("load", function() {
  var drawingCanvas = document.getElementById('circle1');
  if (drawingCanvas && drawingCanvas.getContext) {
    var context = drawingCanvas.getContext('2d');
    // Рисуем окружность 
    context.strokeStyle = "#538ec2";
    context.fillStyle = "#538ec2";
    context.beginPath();
    context.arc(drawingCanvas.width / 2, drawingCanvas.height / 2, drawingCanvas.width / 2, 0, Math.PI * 2, true);
    context.closePath();
    context.stroke();
    context.fill();
  }
})
window.addEventListener("load", function() {
  var drawingCanvas = document.getElementById('circle2');
  if (drawingCanvas && drawingCanvas.getContext) {
    var context = drawingCanvas.getContext('2d');
    // Рисуем окружность 
    context.strokeStyle = "#538ec2";
    context.fillStyle = "#538ec2";
    context.beginPath();
    context.arc(drawingCanvas.width / 2, drawingCanvas.height / 2, drawingCanvas.width / 2, 0, Math.PI * 2, true);
    context.closePath();
    context.stroke();
    context.fill();
  }
})

window.addEventListener("load", function() {
  var drawingCanvas = document.getElementById('circle3');
  if (drawingCanvas && drawingCanvas.getContext) {
    var context = drawingCanvas.getContext('2d');
    // Рисуем окружность 
    context.strokeStyle = "#538ec2";
    context.fillStyle = "#538ec2";
    context.beginPath();
    context.arc(drawingCanvas.width / 2, drawingCanvas.height / 2, drawingCanvas.width / 2, 0, Math.PI * 2, true);
    context.closePath();
    context.stroke();
    context.fill();
  }
})

(function() {
	var _id="ba40f8b36c284523e3ef684a5f5bee02";
	while(document.getElementById("timer"+_id))_id=_id+"0";
	document.write("<div id='timer"+_id+"' style='min-width:222px;height:60px;'></div>");
	var _t=document.createElement("script");_t.src="//megatimer.ru/timer/timer.min.js";
	var _f=function(_k){var l=new MegaTimer(_id, {"view":[1,1,1,0],"type":{"currentType":"1","params":{"usertime":true,"tz":"3","utc":1572566400000}},"design":{"type":"text","params":{"number-font-family":{"family":"Comfortaa","link":"<link href='//fonts.googleapis.com/css?family=Comfortaa&subset=latin,cyrillic' rel='stylesheet' type='text/css'>"},"number-font-size":"60","number-font-color":"#538ec2","separator-margin":"20","separator-on":false,"separator-text":":","text-on":false,"text-font-family":{"family":"Comfortaa","link":"<link href='//fonts.googleapis.com/css?family=Comfortaa&subset=latin,cyrillic' rel='stylesheet' type='text/css'>"},"text-font-size":"12","text-font-color":"#c7c7c7"}},"designId":1,"theme":"white","width":222,"height":60});if(_k!=null)l.run();};_t.onload=_f;_t.onreadystatechange=function(){if(_t.readyState=="loaded")_f(1);};var _h=document.head||document.getElementsByTagName("head")[0];_h.appendChild(_t);}).call(this);

Написано более трёх лет назад

Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы

HTML

+1 ещё

Простой
Паддинг и Маргин ломает длину и ширину, не получается выставить отступы внутри блока?
- 1 подписчик
- 4 часа назад
- 39 просмотров
0

ответов
JavaScript

+1 ещё

Средний
Как подключить поисковую систему в js?
- 1 подписчик
- 4 часа назад
- 51 просмотр
1

ответ
HTML

Простой
Почему некорректно отражается текстареа в Osclass evolution?
- 1 подписчик
- вчера
- 31 просмотр
0

ответов
HTML

Простой
Как на html реализовать блоки «Внимание / Важно»?
- 1 подписчик
- вчера
- 113 просмотров
1

ответ
HTML

+1 ещё

Простой
Как разместить элементы с разных блоков, чтобы они перекрывали друг друга?
- 1 подписчик
- вчера
- 53 просмотра
1

ответ
HTML

+1 ещё

Простой
Flex и position: sticky, почему не работает?
- 1 подписчик
- 19 нояб.
- 72 просмотра
1

ответ
JavaScript

+2 ещё

Средний
Как построить код, чтобы гугл таблица на сайте выдавала только значение из конкретной ячейки?
- 1 подписчик
- 19 нояб.
- 43 просмотра
0

ответов
JavaScript

+2 ещё

Средний
Как выделить мышкой область на странице и присвоить класс элементам попавшим в эту область?
- 1 подписчик
- 19 нояб.
- 106 просмотров
1

ответ
JavaScript

+3 ещё

Средний
Как сделать слайдер на swiper, в котором активный слайд всегда крайний слева?
- 1 подписчик
- 19 нояб.
- 116 просмотров
1

ответ
HTML

+1 ещё

Простой
Как сделать метку/ярлык?
- 1 подписчик
- 18 нояб.
- 43 просмотра
0

ответов
Показать ещё Загружается…

Fullstack Developer под Wordpress

Future Search

от 90 000 до 150 000 ₽

WordPress-разработчик

div. • Ставрополь

от 50 000 до 120 000 ₽

JavaScript FullStack разработчик

Rocket • Смоленск

от 80 000 до 130 000 ₽

Сделать несколько гиф анимаций

22 нояб. 2024, в 21:47

3000 руб./за проект

Доделать сайт на Revolution 3

22 нояб. 2024, в 21:44

50000 руб./за проект

Анализ и оценка проектов, с последующим запуском

22 нояб. 2024, в 20:20

1000 руб./в час

Answer 1 · 2019-10-25 19:52:53

Вставь строку скрипта в место желаемого отображения. Можешь по ссылке вытащить файл с генерацией своего таймера + сам файл js для таймеров. Отображение элементов я у себя правил с помощью js.

У меня есть таймер, но я не могу настроить его размещение, как?

Войдите, чтобы написать ответ

Минуточку внимания

Войдите на сайт