Форум

kempachik · #1 (**permalink**) 13.04.2021, 14:55

Ребят помогите советом не могу подключить JS я делаю фиксированную шапку но сам JS не могу подключить (работаю через Brackets) в Html в коде с низу подключил JQuery (<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> 3 модель)
под ним прописал путь:
<skript src="assets/js/app.js"></skript>
но при всём этом JS не запускается
вот код JS:
$(function () {
var header = $("#header")
, introH = $("#intro").innerHeight()
, scrollOffset = 0;
$(window).on("scroll", function (){
scrollOffset = $(this).scrollTop();
if (scrollOffset >= introH) {
header.addClass("fixed");
}
else {
header.removeClass("fixed");
}
});
});

рони · #2 (**permalink**) 13.04.2021, 15:15

kempachik,
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:

[html run]
... минимальный код страницы с вашей проблемой
[/html]

О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

рони · #3 (**permalink**) 13.04.2021, 15:27

kempachik,

<!DOCTYPE html>
<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
        body {
            height: 2000px;
            margin: 0;
        }
        #intro {
            height: 100px;
            width: 100vw;
            background-color: #008000;
        }
        #header {
            height: 100px;
            width: 100vw;
            background-color: #FF00FF;
        }
        #header.fixed {
            position: fixed;
            top: 0;
        }
    </style>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <script>
        $(function() {
            var header = $("#header"),
                introH = $("#intro").innerHeight(),
                scrollOffset = 0;
            $(window).on("scroll", function() {
                scrollOffset = $(this).scrollTop();
                if (scrollOffset >= introH) {
                    header.addClass("fixed");
                } else {
                    header.removeClass("fixed");
                }
            });
        });
    </script>
</head>
<body>
    <div id="intro"></div>
    <div id="header"></div>
</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript