Время и положение на странице.
Я пробую сделать следующее.
При загрузки страницы элементы Вверх низ я вижу. При скроле я тоже вижу эти элементы. Но мне нужно что когда скролл остановился и не скролится в течении 2 секунд эти элементы спрятались. Скорл снова начался элементы спрятались. И вроде бы как бы не чего сложного но я вот не могу сообразить как это все объединить Вот что я сделал.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
nav{
position: fixed;
display: flex;
align-items: center;
padding: 0px 0px 0px 30px;
top: -60px;
left: 0;
right: 0;
width: 100%;
height: 60px;
background-color: #2e2e2e;
color:#fff;
}
section{
width: 280px;
margin: 0px auto 0px;
}
footer{
position: fixed;
display: flex;
align-items: center;
padding: 0px 0px 0px 30px;
bottom: -60px;
left: 0;
right: 0;
width: 100%;
height: 60px;
background-color: #2e2e2e;
color:#fff;
}
.vverkh{
position: fixed;
top: 0px;
left: 0;
right: 0;
transition: .3s ease-out 0.5s;
}
.niz{
position: fixed;
bottom: 0px;
left: 0;
right: 0;
transition: .3s ease-out 0.5s;
}
</style>
</head>
<body>
<nav class="vverkh">Вверх</nav>
<section>
Также как постоянный количественный рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный план целого ряда внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на базе интернет-аналитики выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями. Как принято считать, активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены исключительно в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов. Внезапно, явные признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными данными до степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий.
Также как постоянный количественный рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный план целого ряда внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на базе интернет-аналитики выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями. Как принято считать, активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены исключительно в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов. Внезапно, явные признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными данными до степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий.
Также как постоянный количественный рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный план целого ряда внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на базе интернет-аналитики выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями. Как принято считать, активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены исключительно в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов. Внезапно, явные признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными данными до степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий.
</section>
<footer class="niz">Низ</footer>
<script>
let body = document.querySelector("body")
let nav = document.querySelector("nav");
let footer = document.querySelector("footer");
window.addEventListener("scroll", function() {
nav.classList.add("vverkh");
footer.classList.add("niz");
console.log("скрол")
})
</script>
</body>
</html>
Не могу понять как написать что если скрола нету в течении двух секунд то Вверх и Низ нужно спрятать. |
Сергей Ракипов,
элементы показать, прежний таймер обнулить, и тут же запускать новый, в таймере убрать элементы, всё |
рони,
При сколе элементы у меня будут показаны. Вот как записать что если скорол не активный запускать таймер, если таймер достигнет 2 секунд то убирать элементы. А если скорл активный то таймер убирать или не запускать. Я синтакс не понимаю |
Сергей Ракипов,
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
nav {
position: fixed;
display: flex;
align-items: center;
padding: 0px 0px 0px 30px;
top: -60px;
left: 0;
right: 0;
width: 100%;
height: 60px;
background-color: #2e2e2e;
color: #fff;
transition: .3s ease-out 0.5s;
}
section {
width: 280px;
margin: 0px auto 0px;
}
footer {
position: fixed;
display: flex;
align-items: center;
padding: 0px 0px 0px 30px;
bottom: -60px;
left: 0;
right: 0;
width: 100%;
height: 60px;
background-color: #2e2e2e;
color: #fff;
transition: .3s ease-out 0.5s;
}
.vverkh {
position: fixed;
top: 0px;
left: 0;
right: 0;
}
.niz {
position: fixed;
bottom: 0px;
left: 0;
right: 0;
}
</style>
</head>
<body>
<nav class="vverkh">Вверх</nav>
<section>
Также как постоянный количественный рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный
план целого ряда внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на
базе интернет-аналитики выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями.
Как принято считать, активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены
исключительно в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов.
Внезапно, явные признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными
данными до степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает
независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий. Также как постоянный количественный
рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный план целого ряда
внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на базе интернет-аналитики
выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями. Как принято считать,
активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены исключительно
в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов. Внезапно,
явные признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными данными
до степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает
независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий. Также как постоянный количественный
рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный план целого ряда
внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на базе интернет-аналитики
выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями. Как принято считать,
активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены исключительно
в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов. Внезапно,
явные признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными данными
до степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает
независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий.
</section>
<footer class="niz">Низ</footer>
<script>
let body = document.querySelector("body")
let nav = document.querySelector("nav");
let footer = document.querySelector("footer");
let pause = 2000, timer;
window.addEventListener("scroll", function() {
window.clearTimeout(timer);
nav.classList.add("vverkh");
footer.classList.add("niz");
timer = window.setTimeout(() => {
nav.classList.remove("vverkh");
footer.classList.remove("niz");
}, pause)
})
</script>
</body>
</html>
|
рони,
Спасибо ))) |
А я вот дополнил код.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
nav {
position: fixed;
display: flex;
align-items: center;
padding: 0px 0px 0px 30px;
top: -60px;
left: 0;
right: 0;
width: 100%;
height: 60px;
background-color: #2e2e2e;
color: #fff;
transition: .3s ease-out 0.5s;
}
section {
width: 280px;
margin: 80px auto 80px;
}
footer {
position: fixed;
display: flex;
align-items: center;
padding: 0px 0px 0px 30px;
bottom: -60px;
left: 0;
right: 0;
width: 100%;
height: 60px;
background-color: #2e2e2e;
color: #fff;
transition: .3s ease-out 0.5s;
}
.vverkh {
position: fixed;
top: 0px;
left: 0;
right: 0;
}
.niz {
position: fixed;
bottom: 0px;
left: 0;
right: 0;
}
.proverka{
width: 30px;
height: 30px;
cursor: pointer;
background-color: #2e2e2e;
margin: 30px 0px 30px 0px;
}
.proverka:hover{
background-color: turquoise;
}
.klik{
display: block;
}
</style>
</head>
<body>
<nav class="vverkh">Вверх</nav>
<section>
<div class="proverka"></div>
Также как постоянный количественный рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный
план целого ряда внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на
базе интернет-аналитики выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями.
Как принято считать, активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены
исключительно в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов.
Внезапно, явные признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными
данными до степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает
независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий. Также как постоянный количественный
рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный план целого ряда
внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на базе интернет-аналитики
выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями. Как принято считать,
активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены исключительно
в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов. Внезапно,
явные признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными данными
до степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает
независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий. Также как постоянный количественный
рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный план целого ряда
внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на базе интернет-аналитики
выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями. Как принято считать,
активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены исключительно
в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов. Внезапно,
явные признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными данными
до степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает
независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий.
</section>
<footer class="niz">Низ</footer>
<script>
let body = document.querySelector("body")
let section = document.querySelector("section")
let nav = document.querySelector("nav");
let footer = document.querySelector("footer");
let pause = 1000, timer;
let proverka = document.querySelector(".proverka");
let proverka_fun = () => {
section.classList.toggle("klik");
}
proverka.addEventListener("click", proverka_fun);
window.addEventListener("scroll", function() {
window.clearTimeout(timer);
nav.classList.add("vverkh");
footer.classList.add("niz");
timer = window.setTimeout(() => {
nav.classList.remove("vverkh");
footer.classList.remove("niz");
}, pause)
if(section.classList.contains('klik')){
timer = window.setTimeout(() => {
nav.classList.add("vverkh");
footer.classList.add("niz");
}, pause)
}
})
</script>
</body>
</html>
И он работает так что если section присвается класс klik то все это не работает. Но как сделать что бы когда класс klik присвоен что бы он не отслеживал событие скрола, потому что так происходит одни раз анимация. То есть правильно написать что если блоку присвоен класс то анимация не происходит, класс убран то анимация происходит |
Сергей Ракипов,
не осилил описание. |
рони,
Просто он как то работает коряво. При загрузки странице видно вверх и низ. Начинаешь скролить все убирается. Останавливаешься через секунду снова все видно. Это было сделано. А сейчас нужно что бы при клике на квадрат вверх низ появлялись и не уходили до тех пор пока второй раз не кликнешь. Как то работает не корректно, вроде на квадрат кликнул но иногда при скроле анимация проигрывается.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
nav {
position: fixed;
display: flex;
align-items: center;
padding: 0px 0px 0px 30px;
top: -60px;
left: 0;
right: 0;
width: 100%;
height: 60px;
background-color: #2e2e2e;
color: #fff;
transition: .3s ease-out 0.5s;
}
section {
width: 280px;
margin: 80px auto 80px;
}
footer {
position: fixed;
display: flex;
align-items: center;
padding: 0px 0px 0px 30px;
bottom: -60px;
left: 0;
right: 0;
width: 100%;
height: 60px;
background-color: #2e2e2e;
color: #fff;
transition: .3s ease-out 0.5s;
}
.vverkh {
position: fixed;
top: 0px;
left: 0;
right: 0;
}
.niz {
position: fixed;
bottom: 0px;
left: 0;
right: 0;
}
.proverka{
width: 30px;
height: 30px;
cursor: pointer;
background-color: #2e2e2e;
margin: 30px 0px 30px 0px;
}
.proverka:hover{
background-color: turquoise;
}
.klik{
display: block;
}
</style>
</head>
<body>
<nav class="vverkh">Вверх</nav>
<section>
Также как постоянный количественный рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный
план целого ряда внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на
базе интернет-аналитики выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями.
Как принято считать, активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены
исключительно в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов.
Внезапно, явные признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными
данными до степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает
независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий. Также как постоянный количественный
рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный план целого ряда
внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на базе интернет-аналитики
выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями. Как принято считать,
активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены исключительно
<div class="proverka"></div>
в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов. Внезапно,
явные признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными данными
до степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает
независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий. Также как постоянный количественный
рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный план целого ряда
внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на базе интернет-аналитики
выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями. Как принято считать,
активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены исключительно
в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов. Внезапно,
явные признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными данными
до степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает
независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий.
</section>
<footer class="niz">Низ</footer>
<script>
let body = document.querySelector("body")
let section = document.querySelector("section")
let nav = document.querySelector("nav");
let footer = document.querySelector("footer");
let pause = 1000, timer;
let proverka = document.querySelector(".proverka");
let proverka_fun = () => {
section.classList.toggle("klik");
}
proverka.addEventListener("click", proverka_fun);
window.addEventListener("scroll", function() {
window.clearTimeout(timer);
nav.classList.add("vverkh");
footer.classList.add("niz");
timer = window.setTimeout(() => {
nav.classList.remove("vverkh");
footer.classList.remove("niz");
}, pause)
if(section.classList.contains('klik')){
timer = window.setTimeout(() => {
nav.classList.add("vverkh");
footer.classList.add("niz");
}, pause)
}
})
</script>
</body>
</html>
|
Сергей Ракипов,
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
nav {
position: fixed;
display: flex;
align-items: center;
padding: 0px 0px 0px 30px;
top: -60px;
left: 0;
right: 0;
width: 100%;
height: 60px;
background-color: #2e2e2e;
color: #fff;
transition: .3s ease-out 0.5s;
}
section {
width: 280px;
margin: 80px auto 80px;
}
footer {
position: fixed;
display: flex;
align-items: center;
padding: 0px 0px 0px 30px;
bottom: -60px;
left: 0;
right: 0;
width: 100%;
height: 60px;
background-color: #2e2e2e;
color: #fff;
transition: .3s ease-out 0.5s;
}
.vverkh {
position: fixed;
top: 0px;
left: 0;
right: 0;
}
.niz {
position: fixed;
bottom: 0px;
left: 0;
right: 0;
}
.proverka {
width: 30px;
height: 30px;
cursor: pointer;
background-color: #2e2e2e;
margin: 30px 0px 30px 0px;
}
.proverka:hover {
background-color: turquoise;
}
.klik {
display: block;
}
</style>
</head>
<body>
<nav class="vverkh">Вверх</nav>
<section>
Также как постоянный количественный рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный
план целого ряда внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на
базе интернет-аналитики выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями.
Как принято считать, активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены
исключительно в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов.
Внезапно, явные признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными
данными до степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает
независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий. Также как постоянный количественный
рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный план целого ряда
внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на базе интернет-аналитики
выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями. Как принято считать,
активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены исключительно
<div class="proverka"></div>
в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов. Внезапно, явные
признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными данными до
степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает
независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий. Также как постоянный количественный
рост и сфера нашей активности является качественно новой ступенью своевременного выполнения сверхзадачи. Предварительные выводы неутешительны: современная методология разработки создаёт необходимость включения в производственный план целого ряда
внеочередных мероприятий с учётом комплекса направлений прогрессивного развития. Также как высокотехнологичная концепция общественного уклада способствует повышению качества укрепления моральных ценностей. А также сделанные на базе интернет-аналитики
выводы, вне зависимости от их уровня, должны быть функционально разнесены на независимые элементы. Внезапно, активно развивающиеся страны третьего мира неоднозначны и будут объективно рассмотрены соответствующими инстанциями. Как принято считать,
активно развивающиеся страны третьего мира указаны как претенденты на роль ключевых факторов. Сложно сказать, почему ключевые особенности структуры проекта и по сей день остаются уделом либералов, которые жаждут быть рассмотрены исключительно
в разрезе маркетинговых и финансовых предпосылок. Но независимые государства заблокированы в рамках своих собственных рациональных ограничений. Для современного мира граница обучения кадров обеспечивает актуальность стандартных подходов. Внезапно,
явные признаки победы институционализации формируют глобальную экономическую сеть и при этом — ограничены исключительно образом мышления. Но многие известные личности являются только методом политического участия и смешаны с не уникальными данными
до степени совершенной неузнаваемости, из-за чего возрастает их статус бесполезности. Высокий уровень вовлечения представителей целевой аудитории является четким доказательством простого факта: экономическая повестка сегодняшнего дня предполагает
независимые способы реализации приоретизации разума над эмоциями. Каждый из нас понимает очевидную вещь: современная методология разработки, в своём классическом представлении, допускает внедрение кластеризации усилий.
</section>
<footer class="niz">Низ</footer>
<script>
let body = document.querySelector("body")
let section = document.querySelector("section")
let nav = document.querySelector("nav");
let footer = document.querySelector("footer");
let pause = 1000,
timer;
let proverka = document.querySelector(".proverka");
let proverka_fun = () => {
window.clearTimeout(timer);
section.classList.toggle("klik");
let show = section.classList.contains('klik');
nav.classList.toggle("vverkh", show);
footer.classList.toggle("niz", show);
}
proverka.addEventListener("click", proverka_fun);
window.addEventListener("scroll", function() {
window.clearTimeout(timer);
if (section.classList.contains('klik')) return;
nav.classList.remove("vverkh");
footer.classList.remove("niz");
timer = window.setTimeout(() => {
nav.classList.add("vverkh");
footer.classList.add("niz");
}, pause)
})
</script>
</body>
</html>
|
рони,
Я объяснил коряво, но работает как нужно, думаю что я сам сейчас поправлю свое коряво объяснение. Спасибо :) |
| Часовой пояс GMT +3, время: 05:38. |