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

Смена видео по клику

17.07.2016, 13:06. Показов 1278. Ответов 0
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Доброго времени суток!
Собственно есть шаблон,на 4 вкладке проигрывается видео в полноэкранном режиме,которое подгружается из папки /video/с помощью jquery.Подскажите пожалуйста,как реализовать кнопку которая бы могла менять видео на фоне на еще одно из той же папки.Например:
Видео 1,Видео 2.
По умолчанию грузится видео1,нажимаешь на ссылку Видео 2,подгружается видео2,и наоборот.
Шаблон прикрепляю.
Буду очень признателен за помощь!!
HTML5
1
2
3
<div class="cd-bg-video-wrapper" data-video="video/sunset-loop">
<!-- video element will be loaded using jQuery -->
</div>
JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function uploadVideo(container) {
        container.find('.cd-bg-video-wrapper').each(function(){
            var videoWrapper = $(this);
            if( videoWrapper.is(':visible') ) {
                // if visible - we are not on a mobile device 
                var videoUrl = videoWrapper.data('video'),
                    video = $('<video loop><source src="'+videoUrl+'.mp4" type="video/mp4" /><source src="'+videoUrl+'.webm" type="video/webm" /></video>');
                video.appendTo(videoWrapper);
                // play video if first slide
                if(videoWrapper.parent('.cd-bg-video.selected').length > 0) video.get(0).play();
            }
        });
    }
 
    function checkVideo(hiddenSlide, container, n) {
        //check if a video outside the viewport is playing - if yes, pause it
        var hiddenVideo = hiddenSlide.find('video');
        if( hiddenVideo.length > 0 ) hiddenVideo.get(0).pause();
 
        //check if the select slide contains a video element - if yes, play the video
        var visibleVideo = container.children('li').eq(n).find('video');
        if( visibleVideo.length > 0 ) visibleVideo.get(0).play();
    }
Вложения
Тип файла: zip templatemo_491_flat.zip (9.12 Мб, 2 просмотров)
0
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
17.07.2016, 13:06
Ответы с готовыми решениями:

Смена изображения по клику
Добрый день два вопроса, помогите плз! 1 при вставке в аккордеон пропал клик по картинке (смена изображений) пример внизу страницы...

Смена картинок по клику
Здравствуйте, нужна помощь! Мне нужно чтоб при нажатии на див картинка менялась: 1.jpg - 2.jpg - 3.jpg.... Когда доходила до 20...

По клику смена картинки
Добрый вечер, подскажите как сделать смену картинки по клику на кнопку... Вот что я наделал, на части js встало всё) &lt;div...

0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
17.07.2016, 13:06
Помогаю со студенческими работами здесь

Смена картинки в img по клику
&lt;div class=&quot;&quot;&gt; &lt;img src=путь к картинке&lt;/img&gt; &lt;/div&gt; нужно сделать для такой разметки slidetoogle правильный, т.е чтобы у src...

Смена background-position по клику
Задача: при клике должен меняться (с анимацией) background-position фона тега body. Я открыл http://www.linkexchanger.su/2008/61.html...

Как сделать паузу по клику на кнопке в теге с видео, с привязкой по классу?
Хочу в модальном окне заиспользовать тег video из html5, вот интересно, когда я окошко модальное закрываю, видео продолжает...

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

Смена изображения на выбранное по клику
Здравствуйте! У меня есть дефолтная автарка на страницу. Когда я на нее кликаю, появляется окно выбора файла(обычный &lt;input...


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

Или воспользуйтесь поиском по форуму:
1
Ответ Создать тему
Новые блоги и статьи
Очистка реквизитов документа при копировании
Maks 09.04.2026
Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .
модель ЗдравоСохранения 8. Подготовка к разному выполнению заданий
anaschu 08.04.2026
https:/ / github. com/ shumilovas/ med2. git main ветка * содержимое блока дэлэй из старой модели теперь внутри зайца новой модели 8ATzM_2aurI
Блокировка документа от изменений, если он открыт у другого пользователя
Maks 08.04.2026
Алгоритм из решения ниже реализован на примере нетипового документа, разработанного в конфигурации КА2. Задача: запретить редактирование документа, если он открыт у другого пользователя. / / . . .
Система безопасности+живучести для сервера-слоя интернета (сети). Двойная привязка.
Hrethgir 08.04.2026
Далее были размышления о системе безопасности. Сообщения с наклонным текстом - мои. А как нам будет можно проверить, что ссылка наша, а не подделана хулиганами, которая выбросит на другую ветку и. . .
Модель ЗдрввоСохранения 7: больше работников, больше ресурсов.
anaschu 08.04.2026
работников и заданий может быть сколько угодно, но настроено всё так, что используется пока что только 20% kYBz3eJf3jQ
Дальние перспективы сервера - слоя сети с космологическим дизайном интефейса карты и логики.
Hrethgir 07.04.2026
Дальнейшее ближайшее планирование вывело к размышлениям над дальними перспективами. И вот тут может быть даже будут нужны оценки специалистов, так как в дальних перспективах всё может очень сильно. . .
Горе от ума
kumehtar 07.04.2026
Эта мне ментальная установка, что вот прямо сейчас, мол, мне для полного счастья не хватает (нужное вписать), и когда я этого достигну - тогда и полный кайф. Одна из самых сильных ловушек на пути. . . .
Использование значений реквизитов справочника в документе, с определенными условиями и правами
Maks 07.04.2026
1. Контроль срока действия договора Алгоритм из решения ниже реализован на примере нетипового документа "ЗаявкаНаРаботу", разработанного в конфигурации КА2. Задача: уведомлять пользователя, если. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru