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

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);

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

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

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

Войти через центр авторизации

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

JavaScript

+1 ещё

Средний
Как задать img источник из svg inline?
- 1 подписчик
- 2 часа назад
- 73 просмотра
1

ответ
JavaScript

+2 ещё

Простой
Смена стилей шапки сайта при скролле к определенному блоку? Стили должны применяться при скролле до блока и отменяться за его пределами?
- 1 подписчик
- 3 часа назад
- 30 просмотров
1

ответ
HTML

+1 ещё

Простой
Как Выделить слово приходящая из базы определенным цветом?
- 1 подписчик
- 3 часа назад
- 105 просмотров
0

ответов
JavaScript

+1 ещё

Средний
Как сделать так, чтобы клик по object передавался родителю?
- 1 подписчик
- 7 часов назад
- 94 просмотра
2

ответа
HTML

+1 ещё

Простой
Можно ли изменить цвет шрифта снаружи для тега у которого цвет прописан внутри?
- 1 подписчик
- 23 часа назад
- 54 просмотра
2

ответа
HTML

+1 ещё

Простой
Как поместить картинку рядом с текстом?
- 1 подписчик
- вчера
- 85 просмотров
2

ответа
HTML

+1 ещё

Средний
Как в файле svg заставить работать события?
- 3 подписчика
- 23 апр.
- 709 просмотров
2

ответа
HTML

+1 ещё

Простой
Почему верхние и нижние внешние отступы пустого блока не схлопываются?
- 2 подписчика
- 22 апр.
- 213 просмотров
4

ответа
HTML

+1 ещё

Простой
Почему пустой div смещается, если ему задать margin-bottom?
- 2 подписчика
- 22 апр.
- 186 просмотров
1

ответ
JavaScript

+2 ещё

Простой
Как сделать появление баннера от определенной высоты?
- 3 подписчика
- 22 апр.
- 617 просмотров
1

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

Тестировщик-стажёр

ITooLabs • Тула

от 35 000 до 40 000 ₽

Fullstack PHP Developer

Smapse Education

от 40 000 до 65 000 ₽

Trainee - IT Support

move2usajobs.com LLC • Лос-Анджелес

от 2 000 до 4 000 $

Разработка игры нарды

25 апр. 2024, в 15:31

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

Верстка мобильной версии на SvelteKit [FIGMA]

25 апр. 2024, в 15:26

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

Сделать ретопологию 3D моделей в Blender

25 апр. 2024, в 15:13

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

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

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

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

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

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

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