Задать вопрос
Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » jQuery » Как реализовать изменения ссылки на видео при клике ?

Как реализовать изменения ссылки на видео при клике ?

     23.07.2015    Все вопросы » jQuery    2223

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

Есть код: 
 <iframe id="player" src="site.ru/video1.mp4" name="film_main" id="film_main" scrolling="no" allowfullscreen="" webkitallowfullscreen="" mozallowfullscreen="" frameborder="0" height="400" width="600"></iframe>
<ul>
<li><a  data-val="site.ru/video1.mp4">Клик чтобы посмотреть видео 1</a></li>
<li><a  data-val="site.ru/video2.mp4">Клик чтобы посмотреть видео 2</a></li>
<li><a  data-val="site.ru/video3.mp4">Клик чтобы посмотреть видео 3</a></li>
</ul>
Нужно чтобы при клике в iframe менялась ссылка на видео.
Есть вот такой рабочий вариант: 
<iframe src="site.ru/video1.mp4" name="film_main" id="film_main" scrolling="no" allowfullscreen="" webkitallowfullscreen="" mozallowfullscreen="" frameborder="0" height="400" width="600"></iframe>    

<select class="movie" name="select_items" style="width: 100%; height: 212px; font-weight:700" size="5" onchange="javascript:urla=this.value;document.getElementById('film_main').src=urla;">

<option value="site.ru/video1.mp4">Клик чтобы посмотреть видео 1</option>
<option value="site.ru/video2.mp4">Клик чтобы посмотреть видео 2</option>
<option value="site.ru/video3.mp4">Клик чтобы посмотреть видео 3</option>
</select>
Но мне надо это осуществить с помощью тегов 
<ul /> и <li />
.
Заранее спасибо.

Ответа пока нет

 

2 комментария

vitnet
PHP-developer

vitnet - 24 июля 2015 10:14 - 

function change(el){
    $('#player').attr('src', $(el).data('src'));
}


 <iframe id="player" src="site.ru/video1.mp4" scrolling="no" allowfullscreen="" webkitallowfullscreen="" mozallowfullscreen="" frameborder="0" height="400" width="600"></iframe>

<ul>
<li><a data-src="site.ru/video1.mp4" onclick="return change(this);">видео 1</a></li>
<li><a data-src="site.ru/video2.mp4" onclick="return change(this);">видео 2</a></li>
<li><a data-src="site.ru/video3.mp4" onclick="return change(this);">видео 3</a></li>
</ul>
Sandman
Юзер

Sandman - 24 июля 2015 10:22 -

Спасибо вот я нашел очень простое решение может кому то понадобится:


<div id="big"> 
<iframe id="player" src="site.ru/video1.mp4" scrolling="no" allowfullscreen="" webkitallowfullscreen="" mozallowfullscreen="" frameborder="0" height="400" width="600"></iframe>
</div>
<ul id="snav">
<li><a  data-link="site.ru/video1.mp4">видео 1</a></li>
<li><a  data-link="site.ru/video2.mp4">видео 2</a></li>
<li><a  data-link="site.ru/video3.mp4">видео 3</a></li>
</ul>




// Change iframe link
    $('#snav li a').on('click', function(){
        $('#big iframe').attr('src', $(this).data('link'));
    });
Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы

 15.03.2013 www7sergey  jQuery
 04.08.2013 monach  jQuery, Ламерские вопросы
 24.08.2013 jarrro  Общие вопросы, jQuery
 15.09.2013 dimon212909  jQuery
 19.01.2014 ale-eex  Шаблоны (TPL), Стили (CSS), jQuery
 19.01.2014 ale-eex  Шаблоны (TPL), Стили (CSS), jQuery
 28.01.2014 estverum  Шаблоны (TPL), jQuery
 18.07.2014 249893  Шаблоны (TPL), jQuery
 20.12.2014 GSMexpress  Общие вопросы по вёрстке, jQuery
 13.07.2015 G-Force  jQuery
  • TeraMoune | Как отключить миниатюры стандартной гале ...
    Фото TeraMoune
    TeraMoune
    Как отключить миниатюры стандартной галереи Fancybox?
    Вчера, 06:00
    В файле engine/classes/fancybox/fancybox.js искать нужную инициализацию и добавлять соответствующие параметры, весь список параметров и их описание можно найти на этой странице https://fancyapps.com/fancybox/api/options/

    Например: параметр Thumbs: false отключает миниатюры.
    Fancybox.bind("[data-highslide]", {
	groupAttr: 'data-highslide',
	idle:2000,
	Thumbs: false,
	caption: (fancybox, slide) => {
		if(  slide.thumbEl && slide.thumbEl.alt ) {
			return slide.thumbEl.alt
		}
	}
});
  • derebas | Как реализовать шифрование трафика? 3
    Фото derebas
    derebas
    Как реализовать шифрование трафика?
    18-11-2024, 16:52
    Ну в теории, можно использовать src на site.com разместить прокси на site2.com а выдавать видео с site3.com, при этом прямой доступ на site3.com закрыть, отдача будет только если запрос с site2.com, таким образом палится только site2.com, НО источник потокового видео, все равно можно увидеть если захотеть, а ссылки, ну купить домен dsac-43efew-csdds.uz как пример
  • Gordi | Перенёс сайт - не работают кнопки, не от ... 8
    Фото Gordi
    Gordi
    Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
    18-11-2024, 14:46
    я уже делал. Пользователь 1000 (это я так понимаю root) и chmod 777
    Так и было...
  • lutskboy | Перенёс сайт - не работают кнопки, не от ... 8
    Фото lutskboy
    lutskboy
    Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
    18-11-2024, 14:39
    чтоб не удалять выстави права и пользователя какие там идут на файлы. .
  • Gordi | Перенёс сайт - не работают кнопки, не от ... 8
    Фото Gordi
    Gordi
    Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
    18-11-2024, 14:37
    т.е. мне снести всё, что я уже загрузил как root, зайти под юзером и закачать снова?
    Видосы в директории upload можно хоть оставить? их там 80 Гб
  • lutskboy | Перенёс сайт - не работают кнопки, не от ... 8
    Фото lutskboy
    lutskboy
    Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
    18-11-2024, 14:17
    фтп обычный юзер а не root
  • Gordi | Перенёс сайт - не работают кнопки, не от ... 8
    Фото Gordi
    Gordi
    Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
    18-11-2024, 14:15
    дэк только так и загружаю
  • Gordi | Как реализовать шифрование трафика? 3
    Фото Gordi
    Gordi
    Как реализовать шифрование трафика?
    18-11-2024, 14:14
    я тоже не понимаю....товарищ один, представитель хостинга сказал, что даже есть модули такие специальные под популярные цмс
  • lutskboy | Перенёс сайт - не работают кнопки, не от ... 8
    Фото lutskboy
    lutskboy
    Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
    18-11-2024, 14:13
    Gordi,
    через фтп загружай
  • Gordi | Перенёс сайт - не работают кнопки, не от ... 8
    Фото Gordi
    Gordi
    Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
    18-11-2024, 14:11
    Привет Николай!
    Всегда загружал от root... посмотришь может? твой плагин тоже не виден ((
    или направь на путь истинный, пжст
наверх