Слайдер не работает

@VadimuSSS · Регистрация: 23.06.2014

Студворк — интернет-сервис помощи студентам

Делаю слайдер по видеоуроку.Вообще впервые делаю слайдер. В принципе, каждый шаг понятен и ясен, но ввиду отсутствия знаний я не могу понять что делаю не так. Весь код идентичен тому, который показан в уроке, но у меня не работает. Более того, phpStorm в котором я работаю выделяет несколько частей скрипта указывая на ошибку. У автора видео все работает.
Вот html + js:

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
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" href="style.css"/>
    <script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui.min.js"></script>
    <script type="text/javascript">
 
    function Slider(){
    $(".slider #1").show("fade",500);
    $(".slider #1").delay(5500).hide("slide",{direction:'left'};500);
 
    var sc=$(".slider img").size();
    var count = 2;
    setInterval(function(){
            $(".slider#"+count).show("slide",{direction:'right'},500);
            $(".slider#"+count).delay(5500).hide("slide",{direction:'left'},500);
 
            if(count == sc){
                count = 1;
            }else{
                count = count+1;
            }
    },6500);
    }
 
    </script>
</head>
<body onload="Slider();">
 
<div id="slider">
    <img src="https://www.cyberforum.ru/images/1.jpg" alt="London" id="1" />
    <img src="https://www.cyberforum.ru/images/2.jpg" alt="London" id="2" />
    <img src="https://www.cyberforum.ru/images/3.jpg" alt="London" id="3" />
</div>
</body>
</html>

а тут стили:

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
#slider
  {
      width: 800px;
      height: 350px;
      margin: 30px auto;
      overflow: hidden;
      background-image: url(images/demo/ajax-loader.gif);
      background-repeat: no-repeat;
      background-position: center;
  }
#slider img
{
    width: 800px;
    height: 350px;
    display: none;
}

@Lazy_Den · 10.10.2014, 15:01

Не ваша в том вина, но вы нашли очень плохой урок. Даже не задумываясь, можете спокойно забыть о нём или оставить, как напоминание о том, "как делать не нужно". А этому "автору", хорошо бы посоветовать вообще удалить этот урок или, если он поднялся выше статуса *овнокодера, то переписать урок заново.

Добавлено через 1 минуту
Если хоть немного по делу, то, как минимум, у вас синтаксическая ошибка

JavaScript
1
$(".slider #1").delay(5500).hide("slide",{direction:'left'},500); // запятая вместо точки с запятой перед 500

@a11igator · 10.10.2014, 15:03

Порекомендую сразу на будущее разбираться в проблеме а не искать готовых рецептов: запустите Internet Explorer с этой страницей и нажмите F12. Посмотреть что за ошибки вылезут в JavaScript

@VadimuSSS · 10.10.2014, 15:33 **[ТС]**

Lazy_Den, очень жаль. Может видео устарело и в этом дело. 2012 года. А какие ресурсы посоветуете? Чтобы научиться делать слайдеры?

Добавлено через 2 минуты
a11igator, Мои знания js не позволяют мне работать таким образом. Я хотел бы сперва посмотреть как это делают знающие люди, повторить за ними. Если получится, то разобрать код по кусочкам и понять его алгоритм. А так, название ошибки мне пока что ни о чем не говорит, я ведь и в синтаксисе еще не сильно разбираюсь.

@Lazy_Den · 10.10.2014, 16:33

Сообщение от VadimuSSS

Может видео устарело и в этом дело.

Не только в этом, хотя и это тоже.

Сообщение от VadimuSSS

я ведь и в синтаксисе еще не сильно разбираюсь

А вот по этой причине, даже и советовать нечего, кроме как изучить основы JS, а затем и jQuery, да и не интересуюсь я всякими видеоуроками, чего и другим желаю. Если бы вы нашли действительно сто́ящий слайдер, то вы вряд ли бы смогли понять суть происходящего. Если же говорить о ресурсах по обучению, то по JavaScript можно посмотреть этот, по jQuery - сложнее, т.к. библиотека развивается и, то что было еще актуально вчера, сегодня уже теряет смысл. Лучший вариант - это официальный сайт, где расписаны методы с примерами. Если же с английским туго, чего быть в программировании не должно априори, то как альтернативка - этот ресурс, хотя и в нем некоторые вещи уже устарели.

Добавлено через 4 минуты
И еще добавлю... Если будет попадаться что-то, где требуется версия библиотеки ниже 1.8, то можно проходить мимо.

@VadimuSSS · 10.10.2014, 17:45 **[ТС]**

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

Добавлено через 3 минуты
Просто думал, что лучше разбираться в чем-то на практике. В книгах, например, уделяется много времени на базовые вещи, много теории и т.д. А с обьявлением переменных и прочими подобными вещами я уже знаком, но не в js, а по другим яп. Однако принцип, думаю, одинаков.

@a11igator · 12.10.2014, 07:06

a11igator, Мои знания js не позволяют мне работать таким образом. Я хотел бы сперва посмотреть как это делают знающие люди, повторить за ними. Если получится, то разобрать код по кусочкам и понять его алгоритм. А так, название ошибки мне пока что ни о чем не говорит, я ведь и в синтаксисе еще не сильно разбираюсь.

Так в том и дело нажать F12 и посмотреть какие вылезли ошибки, чтобы потом разобрать по кусочкам что за что отвечает. А иначе че разбирать если в коде может банально не правильно подключен jQuery, или отсутствует по указанному пути.

@VadimuSSS · 12.10.2014, 13:38 **[ТС]**

Всем спасибо за помощь. Пока что подключил слайдер с помощью bootstrap.

Новые блоги и статьи Все статьи Все блоги /
Кому нужен AOT? DevAlt 26.03.2026 Решил сделать простой ланчер Написал заготовку: dotnet new console --aot -o UrlHandler var items = args. Split(":"); var tag = items; var id = items; var executable = args;. . .	Отправка уведомления на почту при изменении наименования справочника Maks 24.03.2026 Программная отправка письма электронной почты на примере изменения наименования типового справочника "Склады" в конфигурации БП3. Перед реализацией необходимо выполнить настройку системной учетной. . .	модель ЗдравоСохранения 5. Меньше увольнений- больше дохода! anaschu 24.03.2026 Теперь система здравосохранения уменьшает количество увольнений. 9TO2GP2bpX4 a42b81fb172ffc12ca589c7898261ccb/ https:/ / rutube. ru/ video/ a42b81fb172ffc12ca589c7898261ccb/ Слева синяя линия -. . .	Midnight Chicago Blues kumehtar 24.03.2026 Такой Midnight Chicago Blues, знаешь?. . Когда вечерние улицы становятся ночными, а ты не можешь уснуть. Ты идёшь в любимый старый бар, и бармен наливает тебе виски. Ты смотришь на пролетающие. . .
SDL3 для Desktop (MinGW): Вывод текста со шрифтом TTF с помощью библиотеки SDL3_ttf на Си и C++ 8Observer8 24.03.2026 Содержание блога Финальные проекты на Си и на C++: finish-text-sdl3-c. zip finish-text-sdl3-cpp. zip	Жизнь в неопределённости kumehtar 23.03.2026 Жизнь — это постоянное существование в неопределённости. Например, даже если у тебя есть список дел, невозможно дойти до точки, где всё окончательно завершено и больше ничего не осталось. В принципе,. . .	Модель здравоСохранения: работники работают быстрее после её введения. anaschu 23.03.2026 geJalZw1fLo Корпорация до введения программа здравоохранения имела много невыполненных работниками заданий, после введения программы количество заданий выросло. Но на выплатах по больничным это. . .	Контроль уникальности заводского номера Maks 23.03.2026 Алгоритм контроля уникальности заводского (или серийного) номера на примере нетипового документа выдачи шин для спецтехники с табличной частью, разработанного в конфигурации КА2. Номеклатура. . .

@a11igator 5 / 5 / 2 Регистрация: 04.03.2013 Сообщений: 12
	10.10.2014, 15:03
	Порекомендую сразу на будущее разбираться в проблеме а не искать готовых рецептов: запустите Internet Explorer с этой страницей и нажмите F12. Посмотреть что за ошибки вылезут в JavaScript 0

@VadimuSSS 2 / 2 / 0 Регистрация: 23.06.2014 Сообщений: 167
	10.10.2014, 15:33 [ТС]
	Lazy_Den, очень жаль. Может видео устарело и в этом дело. 2012 года. А какие ресурсы посоветуете? Чтобы научиться делать слайдеры? Добавлено через 2 минуты a11igator, Мои знания js не позволяют мне работать таким образом. Я хотел бы сперва посмотреть как это делают знающие люди, повторить за ними. Если получится, то разобрать код по кусочкам и понять его алгоритм. А так, название ошибки мне пока что ни о чем не говорит, я ведь и в синтаксисе еще не сильно разбираюсь. 0

@VadimuSSS 2 / 2 / 0 Регистрация: 23.06.2014 Сообщений: 167
	10.10.2014, 17:45 [ТС]
	Lazy_Den, ясно, спасибо за ценные советы. С английским все в порядке. Видео урок, который смотрел как раз и был на англе. Чтож, буду учить... Добавлено через 3 минуты Просто думал, что лучше разбираться в чем-то на практике. В книгах, например, уделяется много времени на базовые вещи, много теории и т.д. А с обьявлением переменных и прочими подобными вещами я уже знаком, но не в js, а по другим яп. Однако принцип, думаю, одинаков. 0

@VadimuSSS 2 / 2 / 0 Регистрация: 23.06.2014 Сообщений: 167
	12.10.2014, 13:38 [ТС]
	Всем спасибо за помощь. Пока что подключил слайдер с помощью bootstrap. 0