Форум программистов, компьютерный форум, киберфорум
jQuery
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
0 / 0 / 0
Регистрация: 18.05.2015
Сообщений: 8

Не работает скрипт показа кнопки вверх страницы

03.07.2022, 17:39. Показов 413. Ответов 3
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Доброго вечера!
Помогите пожалуйста разобраться.

Делала кнопку по уроку

После подключения скрипта не отображается кнопка.
Библиотеку jQuery подключила где надо.

При этом если залить на pencode.io - там всё работает, блин. Что я упускаю?

Полный код на pencode.io

На всякий случай код скрипта сюда положу:
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
function backToTop() {
    let button = $('.back-to-top');
    
    $(window).on('scroll', () => {
        if ($(this).scrollTop() >= 50) {
            button.fadeIn();
        } else {
            button.fadeOut();
        }
    });
    
    button.on('click', (e) => {
        e.preventDefault(); 
        $('html').animate({scrollTop: 0}, 1000);
    })
}
 
backToTop();
До этого долго билась, оказывается нужно было подключить jQuery, поняла это не сразу.
Подключила в шапку перед моим скриптом - всё равно не фурычит.
Ещё думала, что возможно нужна запятая на 15 строке - но с ней или без неё не фурычит всё равно (у автора видео фурычит). Страницу обновляла через shift+f5 - ну должно было заработать, если в этом проблема. Браузер даже обновила.

Больше нет идей, что может быть не так...
Подскажите, пожалуйста!
0
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
03.07.2022, 17:39
Ответы с готовыми решениями:

Скрипт для прокрутки страницы вверх.
Очень, ну просто очень понравился скрипт прокрутки страницы вверх на вот этом сайте: {ссылка удалена}. Когда прокручиваешь страницу он как...

Прокрутка страницы вверх по нажатию кнопки
Доброго времени суток. Имеется форма, в которую пользователь заполняет данные. Есть обязательные данные. Подвесил на vue проверку...

Кнопки - следующая и предыдущая страницы - съезжают вверх
Ребят, такое дело, когда много товара то появляются кнопки: следующая страница и тд... но почему-то они съехали вверх! Как их вернуть на...

3
126 / 94 / 34
Регистрация: 24.06.2022
Сообщений: 253
03.07.2022, 19:29
добавьте к скрипту атрибут defer

PHP/HTML
1
  <script defer src="script.js"></script>
1
Философ-разговорник
 Аватар для Padonak
1066 / 391 / 120
Регистрация: 20.02.2016
Сообщений: 884
Записей в блоге: 1
03.07.2022, 20:00
JavaScript
1
 $('body').animate({scrollTop: 0}, 1000);
Добавлено через 12 минут
Ну и, понятное дело, запускать всё это после загрузки окна

PHP/HTML
1
onload = backToTop;
Добавлено через 38 секунд
PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
<html>
<head>
    <style>
    .back-to-top {
    position: fixed;
    left: 100px;
    bottom: 100px; 
    width: 50px;
    height: 50px;
    border-color:transparent;
    border-radius:50%;
    background-color: #AE7085;
    display: none;  
}
 
.back-to-top:hover,
.back-to-top:focus {
    filter: brightness(1.1);
    outline: none;
    
}
 
.back-to-top::before, 
.back-to-top::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    
}
 
.back-to-top::before {
    width: 5px;
    height: 25px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    background-color: #f5f0f6;
    
    
}
 
 
.back-to-top::after {
    width: 15px;
    height: 15px;
    transform: translate(-50%, -50%) rotate(45deg);
    border-top: 5px solid #f5f0f6;
    border-left: 5px solid #f5f0f6;
    
}
 
    </style>
    <script src="https://code.jquery.com/jquery-3.4.1.js"></script>
    <script>
 
 
    function backToTop() {
    const button = $('.back-to-top');
    
    $(window).on('scroll', () => {
        if ($(this).scrollTop() >= 50) {
            button.fadeIn();
        } else {
            button.fadeOut();
        }
    });
    
    button.on('click', (e) => {
        e.preventDefault(); 
        $('body').animate({scrollTop : 0}, 'slow');
    })
}
 
 
onload = backToTop;
 
 
 
 
 
    </script>
    
</head>
 
<body>
 
 
 
 
<a href="#" class="back-to-top"></a>
 
<a href="#" class="box1" ></a>
 
 
<div class="box">
Актинидия коломикта Адам (мужской сорт) - Актинидия коломикта Adam это мужская форма актинидии коломикта. Декоративный сорт с очень красиво окрашенными листьями, высотой до 4,0 м. Начиная с трехлетнего возраста листья в конце мая окрашиваются в белый цвет, а еще позже в розовый. Чем старше растение и солнечное место посадки, тем больше листва окрашивается. У растений с мужским типом, окраска листьев намного ярче и насыщенней, чем у лианы с женским типом. Цветки мужские, мелкие, белые с желтыми тычинками, с легким лимонным ароматом. Цветет в мае. Обрезать лучше осенью или зимой, когда нет движения сока. Очень зимостойка, устойчива к болезням и вредителям. Актинидия - древесная листопадная лиана, относится к семейству Актинидиевые. Плоды одного из видов актинидии - актинидия деликатесная - хорошо известны нам как киви. Естественным местообитанием актинидии является субтропический пояс - Гималаи, Юго-Восточная Азия, Дальний Восток. Многие виды актинидии приспособлены для выращивания в умеренном климате и с каждым годом набирают все большую популярность среди садоводов. Наибольшее распространение в наших садах получили два вида актинидии культурной - коломикта и аргута.
 
 
 
</div>
 
<div>
Актинидия коломикта Адам (мужской сорт) - Актинидия коломикта Adam это мужская форма актинидии коломикта. Декоративный сорт с очень красиво окрашенными листьями, высотой до 4,0 м. Начиная с трехлетнего возраста листья в конце мая окрашиваются в белый цвет, а еще позже в розовый. Чем старше растение и солнечное место посадки, тем больше листва окрашивается. У растений с мужским типом, окраска листьев намного ярче и насыщенней, чем у лианы с женским типом. Цветки мужские, мелкие, белые с желтыми тычинками, с легким лимонным ароматом. Цветет в мае. Обрезать лучше осенью или зимой, когда нет движения сока. Очень зимостойка, устойчива к болезням и вредителям. Актинидия - древесная листопадная лиана, относится к семейству Актинидиевые. Плоды одного из видов актинидии - актинидия деликатесная - хорошо известны нам как киви. Естественным местообитанием актинидии является субтропический пояс - Гималаи, Юго-Восточная Азия, Дальний Восток. Многие виды актинидии приспособлены для выращивания в умеренном климате и с каждым годом набирают все большую популярность среди садоводов. Наибольшее распространение в наших садах получили два вида актинидии культурной - коломикта и аргута.
 
 
 
</div><div>
Актинидия коломикта Адам (мужской сорт) - Актинидия коломикта Adam это мужская форма актинидии коломикта. Декоративный сорт с очень красиво окрашенными листьями, высотой до 4,0 м. Начиная с трехлетнего возраста листья в конце мая окрашиваются в белый цвет, а еще позже в розовый. Чем старше растение и солнечное место посадки, тем больше листва окрашивается. У растений с мужским типом, окраска листьев намного ярче и насыщенней, чем у лианы с женским типом. Цветки мужские, мелкие, белые с желтыми тычинками, с легким лимонным ароматом. Цветет в мае. Обрезать лучше осенью или зимой, когда нет движения сока. Очень зимостойка, устойчива к болезням и вредителям. Актинидия - древесная листопадная лиана, относится к семейству Актинидиевые. Плоды одного из видов актинидии - актинидия деликатесная - хорошо известны нам как киви. Естественным местообитанием актинидии является субтропический пояс - Гималаи, Юго-Восточная Азия, Дальний Восток. Многие виды актинидии приспособлены для выращивания в умеренном климате и с каждым годом набирают все большую популярность среди садоводов. Наибольшее распространение в наших садах получили два вида актинидии культурной - коломикта и аргута.
 
 
 
</div><div>
Актинидия коломикта Адам (мужской сорт) - Актинидия коломикта Adam это мужская форма актинидии коломикта. Декоративный сорт с очень красиво окрашенными листьями, высотой до 4,0 м. Начиная с трехлетнего возраста листья в конце мая окрашиваются в белый цвет, а еще позже в розовый. Чем старше растение и солнечное место посадки, тем больше листва окрашивается. У растений с мужским типом, окраска листьев намного ярче и насыщенней, чем у лианы с женским типом. Цветки мужские, мелкие, белые с желтыми тычинками, с легким лимонным ароматом. Цветет в мае. Обрезать лучше осенью или зимой, когда нет движения сока. Очень зимостойка, устойчива к болезням и вредителям. Актинидия - древесная листопадная лиана, относится к семейству Актинидиевые. Плоды одного из видов актинидии - актинидия деликатесная - хорошо известны нам как киви. Естественным местообитанием актинидии является субтропический пояс - Гималаи, Юго-Восточная Азия, Дальний Восток. Многие виды актинидии приспособлены для выращивания в умеренном климате и с каждым годом набирают все большую популярность среди садоводов. Наибольшее распространение в наших садах получили два вида актинидии культурной - коломикта и аргута.
 
 
 
</div><div>
Актинидия коломикта Адам (мужской сорт) - Актинидия коломикта Adam это мужская форма актинидии коломикта. Декоративный сорт с очень красиво окрашенными листьями, высотой до 4,0 м. Начиная с трехлетнего возраста листья в конце мая окрашиваются в белый цвет, а еще позже в розовый. Чем старше растение и солнечное место посадки, тем больше листва окрашивается. У растений с мужским типом, окраска листьев намного ярче и насыщенней, чем у лианы с женским типом. Цветки мужские, мелкие, белые с желтыми тычинками, с легким лимонным ароматом. Цветет в мае. Обрезать лучше осенью или зимой, когда нет движения сока. Очень зимостойка, устойчива к болезням и вредителям. Актинидия - древесная листопадная лиана, относится к семейству Актинидиевые. Плоды одного из видов актинидии - актинидия деликатесная - хорошо известны нам как киви. Естественным местообитанием актинидии является субтропический пояс - Гималаи, Юго-Восточная Азия, Дальний Восток. Многие виды актинидии приспособлены для выращивания в умеренном климате и с каждым годом набирают все большую популярность среди садоводов. Наибольшее распространение в наших садах получили два вида актинидии культурной - коломикта и аргута.
 
 
 
</div><div>
Актинидия коломикта Адам (мужской сорт) - Актинидия коломикта Adam это мужская форма актинидии коломикта. Декоративный сорт с очень красиво окрашенными листьями, высотой до 4,0 м. Начиная с трехлетнего возраста листья в конце мая окрашиваются в белый цвет, а еще позже в розовый. Чем старше растение и солнечное место посадки, тем больше листва окрашивается. У растений с мужским типом, окраска листьев намного ярче и насыщенней, чем у лианы с женским типом. Цветки мужские, мелкие, белые с желтыми тычинками, с легким лимонным ароматом. Цветет в мае. Обрезать лучше осенью или зимой, когда нет движения сока. Очень зимостойка, устойчива к болезням и вредителям. Актинидия - древесная листопадная лиана, относится к семейству Актинидиевые. Плоды одного из видов актинидии - актинидия деликатесная - хорошо известны нам как киви. Естественным местообитанием актинидии является субтропический пояс - Гималаи, Юго-Восточная Азия, Дальний Восток. Многие виды актинидии приспособлены для выращивания в умеренном климате и с каждым годом набирают все большую популярность среди садоводов. Наибольшее распространение в наших садах получили два вида актинидии культурной - коломикта и аргута.
 
 
 
</div><div>
Актинидия коломикта Адам (мужской сорт) - Актинидия коломикта Adam это мужская форма актинидии коломикта. Декоративный сорт с очень красиво окрашенными листьями, высотой до 4,0 м. Начиная с трехлетнего возраста листья в конце мая окрашиваются в белый цвет, а еще позже в розовый. Чем старше растение и солнечное место посадки, тем больше листва окрашивается. У растений с мужским типом, окраска листьев намного ярче и насыщенней, чем у лианы с женским типом. Цветки мужские, мелкие, белые с желтыми тычинками, с легким лимонным ароматом. Цветет в мае. Обрезать лучше осенью или зимой, когда нет движения сока. Очень зимостойка, устойчива к болезням и вредителям. Актинидия - древесная листопадная лиана, относится к семейству Актинидиевые. Плоды одного из видов актинидии - актинидия деликатесная - хорошо известны нам как киви. Естественным местообитанием актинидии является субтропический пояс - Гималаи, Юго-Восточная Азия, Дальний Восток. Многие виды актинидии приспособлены для выращивания в умеренном климате и с каждым годом набирают все большую популярность среди садоводов. Наибольшее распространение в наших садах получили два вида актинидии культурной - коломикта и аргута.
 
 
 
</div><div>
Актинидия коломикта Адам (мужской сорт) - Актинидия коломикта Adam это мужская форма актинидии коломикта. Декоративный сорт с очень красиво окрашенными листьями, высотой до 4,0 м. Начиная с трехлетнего возраста листья в конце мая окрашиваются в белый цвет, а еще позже в розовый. Чем старше растение и солнечное место посадки, тем больше листва окрашивается. У растений с мужским типом, окраска листьев намного ярче и насыщенней, чем у лианы с женским типом. Цветки мужские, мелкие, белые с желтыми тычинками, с легким лимонным ароматом. Цветет в мае. Обрезать лучше осенью или зимой, когда нет движения сока. Очень зимостойка, устойчива к болезням и вредителям. Актинидия - древесная листопадная лиана, относится к семейству Актинидиевые. Плоды одного из видов актинидии - актинидия деликатесная - хорошо известны нам как киви. Естественным местообитанием актинидии является субтропический пояс - Гималаи, Юго-Восточная Азия, Дальний Восток. Многие виды актинидии приспособлены для выращивания в умеренном климате и с каждым годом набирают все большую популярность среди садоводов. Наибольшее распространение в наших садах получили два вида актинидии культурной - коломикта и аргута.
 
 
 
</div><div>
Актинидия коломикта Адам (мужской сорт) - Актинидия коломикта Adam это мужская форма актинидии коломикта. Декоративный сорт с очень красиво окрашенными листьями, высотой до 4,0 м. Начиная с трехлетнего возраста листья в конце мая окрашиваются в белый цвет, а еще позже в розовый. Чем старше растение и солнечное место посадки, тем больше листва окрашивается. У растений с мужским типом, окраска листьев намного ярче и насыщенней, чем у лианы с женским типом. Цветки мужские, мелкие, белые с желтыми тычинками, с легким лимонным ароматом. Цветет в мае. Обрезать лучше осенью или зимой, когда нет движения сока. Очень зимостойка, устойчива к болезням и вредителям. Актинидия - древесная листопадная лиана, относится к семейству Актинидиевые. Плоды одного из видов актинидии - актинидия деликатесная - хорошо известны нам как киви. Естественным местообитанием актинидии является субтропический пояс - Гималаи, Юго-Восточная Азия, Дальний Восток. Многие виды актинидии приспособлены для выращивания в умеренном климате и с каждым годом набирают все большую популярность среди садоводов. Наибольшее распространение в наших садах получили два вида актинидии культурной - коломикта и аргута.
 
 
 
</div><div>
Актинидия коломикта Адам (мужской сорт) - Актинидия коломикта Adam это мужская форма актинидии коломикта. Декоративный сорт с очень красиво окрашенными листьями, высотой до 4,0 м. Начиная с трехлетнего возраста листья в конце мая окрашиваются в белый цвет, а еще позже в розовый. Чем старше растение и солнечное место посадки, тем больше листва окрашивается. У растений с мужским типом, окраска листьев намного ярче и насыщенней, чем у лианы с женским типом. Цветки мужские, мелкие, белые с желтыми тычинками, с легким лимонным ароматом. Цветет в мае. Обрезать лучше осенью или зимой, когда нет движения сока. Очень зимостойка, устойчива к болезням и вредителям. Актинидия - древесная листопадная лиана, относится к семейству Актинидиевые. Плоды одного из видов актинидии - актинидия деликатесная - хорошо известны нам как киви. Естественным местообитанием актинидии является субтропический пояс - Гималаи, Юго-Восточная Азия, Дальний Восток. Многие виды актинидии приспособлены для выращивания в умеренном климате и с каждым годом набирают все большую популярность среди садоводов. Наибольшее распространение в наших садах получили два вида актинидии культурной - коломикта и аргута.
 
 
 
</div><div>
Актинидия коломикта Адам (мужской сорт) - Актинидия коломикта Adam это мужская форма актинидии коломикта. Декоративный сорт с очень красиво окрашенными листьями, высотой до 4,0 м. Начиная с трехлетнего возраста листья в конце мая окрашиваются в белый цвет, а еще позже в розовый. Чем старше растение и солнечное место посадки, тем больше листва окрашивается. У растений с мужским типом, окраска листьев намного ярче и насыщенней, чем у лианы с женским типом. Цветки мужские, мелкие, белые с желтыми тычинками, с легким лимонным ароматом. Цветет в мае. Обрезать лучше осенью или зимой, когда нет движения сока. Очень зимостойка, устойчива к болезням и вредителям. Актинидия - древесная листопадная лиана, относится к семейству Актинидиевые. Плоды одного из видов актинидии - актинидия деликатесная - хорошо известны нам как киви. Естественным местообитанием актинидии является субтропический пояс - Гималаи, Юго-Восточная Азия, Дальний Восток. Многие виды актинидии приспособлены для выращивания в умеренном климате и с каждым годом набирают все большую популярность среди садоводов. Наибольшее распространение в наших садах получили два вида актинидии культурной - коломикта и аргута.
 
 
 
</div>
 
</body>
 
</html>
2
0 / 0 / 0
Регистрация: 18.05.2015
Сообщений: 8
03.07.2022, 21:08  [ТС]
Спасибо. Стрелка появилась, но начала мигать странно. Разбираюсь.

Добавлено через 1 минуту
Благодарю!
На чистом примере работает безупречно!

Вставляю в свой проект на локалке - не работает ссылка. При нажатии просто ничего не происходит. Чудеса..
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
03.07.2022, 21:08
Помогаю со студенческими работами здесь

Не работает скрипт JS. Кнопка работает везде кроме главной страницы
Joomla 1.5 Кнопка заказать звонок http://www.presstime.ru Почему так происходит? Скрипты вроде подключены

Не работает скрипт прокрутки страницы
Добрый день. Может, пишу не туда, но возникла проблема со скриптом, который при нажатии на кнопку должен плавно прокручивать страницу...

Скрипт показа фото
Добрый вечер. Не могу разобраться, как сместить стрелки листания ниже самой картинки страница создавалась по шаблону и...

Порекомендуйте скрипт показа баннеров
Главное чтобы работал на PHP 5.4.х и MysQl 5.6.x Простой. Статистика и вход для клиентов для просмотра статистики. Сейчас использую...

Не работает скрипт при ajax перезагрузке страницы
Доброго времени суток. Прошу помощи , ь на сайте http://womanx.xyz/simone/home.php , обновление страниц идет через ajax. Есть видео ,...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
4
Ответ Создать тему
Новые блоги и статьи
PhpStorm 2025.3: WSL Terminal всегда стартует в ~
and_y87 14.12.2025
PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .
Как объединить две одинаковые БД Access с разными данными
VikBal 11.12.2025
Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук
volvo 07.12.2025
Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro
Музыка, написанная Искусственным Интеллектом
volvo 04.12.2025
Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .
От async/await к виртуальным потокам в Python
IndentationError 23.11.2025
Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
Поиск "дружественных имён" СОМ портов
Argus19 22.11.2025
Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .
Сколько Государство потратило денег на меня, обеспечивая инсулином.
Programma_Boinc 20.11.2025
Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .
Ломающие изменения в C#.NStar Alpha
Etyuhibosecyu 20.11.2025
Уже можно не только тестировать, но и пользоваться C#. NStar - писать оконные приложения, содержащие надписи, кнопки, текстовые поля и даже изображения, например, моя игра "Три в ряд" написана на этом. . .
Мысли в слух
kumehtar 18.11.2025
Кстати, совсем недавно имел разговор на тему медитаций с людьми. И обнаружил, что они вообще не понимают что такое медитация и зачем она нужна. Самые базовые вещи. Для них это - когда просто люди. . .
Создание Single Page Application на фреймах
krapotkin 16.11.2025
Статья исключительно для начинающих. Подходы оригинальностью не блещут. В век Веб все очень привыкли к дизайну Single-Page-Application . Быстренько разберем подход "на фреймах". Мы делаем одну. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2025, CyberForum.ru