Перейти к содержимому


Пользователь месяца
Ixman Ixman 1-й за Октябрь
Очков активности: 693 0 тем, 33 сообщения, 14 баллов репутации
Сайт: o5cat.ru
ТОП самых активных за этот месяц
  • Фотография ShowPrint
    #1

    ShowPrint (ShowPrint.ru)
    Очков активности: 96 Вне конкурса за определение пользователя месяца

  • Фотография yuran
    #2

    yuran (yurbol.ru)
    Очков активности: 81 0 тем, 54 сообщения, 1 балл репутации

  • Фотография Ixman
    #3

    Ixman (o5cat.ru)
    Очков активности: 67.5 Вне конкурса за определение пользователя месяца

  • Фотография BLIK
    #4

    BLIK
    Очков активности: 51 Вне конкурса за определение пользователя месяца

  • Фотография Mandarin
    #5

    Mandarin
    Очков активности: 42 0 тем, 28 сообщений, 1 балл репутации

  • Фотография WGN
    #6

    WGN (worldgamenews.com)
    Очков активности: 39 Вне конкурса за определение пользователя месяца

  • Фотография pozitron123
    #7

    pozitron123
    Очков активности: 31.5 2 темы, 15 сообщений, 1 балл репутации

  • Фотография алексс
    #8

    алексс
    Очков активности: 27 2 темы, 12 сообщений, 1 балл репутации

  • Фотография Mariko
    #9

    Mariko
    Очков активности: 16.5 1 тема, 8 сообщений, 1 балл репутации

  • Фотография RosenRot
    #10

    RosenRot (abuzov.com)
    Очков активности: 13.5 1 тема, 6 сообщений, 1 балл репутации

  • Показать весь ТОП 10
Поддержите форум! =)
Апдейты
  • Яндекс ИКС: 31.10.2018
  • Яндекс выдача: 15.11.2018
Топ 5 участников по репутации


Табы для iframe

#1 Steelist

Steelist
  • Неактивные
  • 7 сообщений
  • Репутация: 0
0

Отправлено 01 April 2017 - 10:18

День добрый!

 

Подскажите как это http://jsfiddle.net/ty8kprrb/1/#run можно запустить на сайте? В этом ничего не понимаю, пробовал копиравать - толку никакого.


 

 

  • 0

#2 ShowPrint

ShowPrint
  • Пользователь PRO
  • 3072 сообщений
  • Репутация: 844

Отправлено 01 April 2017 - 10:41

@Steelist, обратили внимание что к песочнице подключены внешние ресурсы (External Resources)?

 

Чтоб это работало на странице нужно как минимум подключение jquery-ui


  • 1
MasterWEBS: третий дом - моё хобби и увлечение... Второй дом: работа - не меньше 12 часов в день...
Первый дом - под охраной: "Осторожно - злая жена!" (дрессировалась долго и надёжно) /*ссылку не просите - не дам!*/


#3 Steelist

Steelist
    Topic Starter
  • Неактивные
  • 7 сообщений
  • Репутация: 0

Отправлено 01 April 2017 - 11:12

@ShowPrint, Да, я обратил на это внимание. Но как их подключить? 


  • 0

#4 ShowPrint

ShowPrint
  • Пользователь PRO
  • 3072 сообщений
  • Репутация: 844

Отправлено 01 April 2017 - 11:15

@Steelist, а так пробовали?


  • 0
MasterWEBS: третий дом - моё хобби и увлечение... Второй дом: работа - не меньше 12 часов в день...
Первый дом - под охраной: "Осторожно - злая жена!" (дрессировалась долго и надёжно) /*ссылку не просите - не дам!*/


#5 yury

yury
  • Пользователь
  • 642 сообщений
  • Репутация: 188

Отправлено 01 April 2017 - 12:27

Подскажите как это http://jsfiddle.net/ty8kprrb/1/#run можно запустить на сайте? В этом ничего не понимаю, пробовал копиравать - толку никакого.

 
Как-то так
 
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
<title>Youtube stop video</title>
</head>
<body>
  <div id="tabs">
  <ul>
    <li><a href="#tabs-1" class="haract_line">1 видео</a></li>
    <li><a href="#tabs-2" class="haract_line">2 видео</a></li>
    <li><a href="#tabs-3" class="haract_line">3 видео</a></li>
  </ul>
  <div id="tabs-1" class="animated fadeInRight">
    <iframe width="570" height="351" src="http://www.youtube.com/embed/Lkb1kGCsIJ0?enablejsapi=1" frameborder="0" allowfullscreen="true" allowscriptaccess="always"></iframe>
  </div>
  <div id="tabs-2" class="animated fadeInRight video1">
    <iframe width="570" height="351" src="http://www.youtube.com/embed/9bZkp7q19f0?enablejsapi=1" frameborder="0" allowfullscreen="true" allowscriptaccess="always"></iframe>
  </div>
  <div id="tabs-3" class="animated fadeInRight video1">
    <iframe width="570" height="351" src="http://www.youtube.com/embed/XS6ysDFTbLU?enablejsapi=1" frameborder="0" allowfullscreen="true" allowscriptaccess="always"></iframe>
  </div>
</div>
<script type='text/javascript'>
$(function() {
  $('#tabs').tabs({
    activate: function(event, ui) {
      $('iframe', ui.oldPanel)
        .get(0)
        .contentWindow
        .postMessage('{"event":"command","func":"stopVideo","args":""}', '*');
    }
  });
});
</script>
</body>
</html>

Про внешние ресурсы.

Но как их подключить?


Внешние ресурсы с сайта http://code.jquery.com/ здесь подключены следующими строками (в коде выше - начиная с 5й):
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">

Сообщение отредактировал yury: 01 April 2017 - 12:28

  • 2

#6 Steelist

Steelist
    Topic Starter
  • Неактивные
  • 7 сообщений
  • Репутация: 0

Отправлено 01 April 2017 - 14:21

@yury,Спасибо. Работает. А внешние ресурсы можно же в head (header.php)поставить? И если я хочю свои стили сделать, то можно 

<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">

убрать и сделать просто: в самой записи сделать <style> .tabs....и так далее?

@ShowPrint, Благодарю, но для меня это пока муторно все, но зато много нового узнал. Спасибо. 


  • 0

#7 Steelist

Steelist
    Topic Starter
  • Неактивные
  • 7 сообщений
  • Репутация: 0

Отправлено 01 April 2017 - 15:38

@yury, В общем это не то что нужно. Другие плеера, кроме ютуба не отанавливают воспроизведение при переключении табов. Надо как тут http://ok-tv.org/cha...tnt-comedy.html , чтоб видео останавливалось при переключении.


Надо как тут http://ok-tv.org/cha...tnt-comedy.html , чтоб видео останавливалось при переключении.
есть ли попроще способ? Надо как тут http://ok-tv.org/cha...tnt-comedy.html , чтоб видео останавливалось при переключении.
  • 0



Похожие темы

  Название темы Автор Статистика Последнее сообщение

Оформление форума – IPBSkins.ru