Не нравятся результаты поиска? Попробуйте другой поиск!
dle-faq.ru FAQ (все вопросы) jQuery Как настроить переключатель серий?

Как настроить переключатель серий?


     19.10.2015    jQuery    1145

вопрос
Здравствуйте. В интернете на одном сайте нашел прикольный переключатель серий и сезонов, и еще в добавок их перелистывания. В общем я выдернул код, но как сделать что бы когда я нажимал на серию, она включалась, то есть, я жму например на "2 серия", и оно автоматом подставляет код серии, и выводи ее.

Вот код JS

$(document).ready(function(){   
                                                $(".tvs_slides").tvs({
                                                    controlsFade: true,
                                                    speed: 400
                                                });
                                                $('.tvs_slides_seasons:first li:first span:first').click();
                                            });
                                            
                                            function showEpisodes( season, obj ) {
                                                var self = $(obj);
                                                if( ! self.hasClass('active') ) {
                                                    $('.tvs_slides_seasons li span').removeClass('active');
                                                    self.addClass('active');
                                                    $('.tvs_slides_episodes').hide();
                                                    $('#episodes-' + season).show().find('li:first span:first').click();
                                                }
                                            }
                                            
                                            function showCode( episode, obj ) {
                                                var self = $(obj);
                                                if( ! self.hasClass('active') ) {
                                                    $('.tvs_slides_episodes li span').removeClass('active');
                                                    self.addClass('active');
                                                    document.getElementById('episode-code').innerHTML = response;
                                                }
                                            };


А вот html

<div class="tvs_slides_wrap tvs_slides_seasons">
                                                <div class="tvs_slides">
                                                    <ul>
                                                        <li>
                                                        <span onclick="showEpisodes(код серии);">1 сезон</span>
                                                        <span onclick="showEpisodes(код серии);">2 сезон</span>
                                                        <span onclick="showEpisodes(код серии);">3 сезон</span>
                                                        </li>
                                                    </ul>
                                                </div>
                                                
                                                <span class="tvs_prev"><a href="javascript:void(0);">Previous</a></span>
                                                <span class="tvs_next"><a href="javascript:void(0);">Next</a></span>
                                            </div>
                                            
                                            <div id="episode-code"></div>
                                            
                                            <div id="episodes-1" class="tvs_slides_wrap tvs_slides_episodes">
                                                <div class="tvs_slides">
                                                    <ul>
                                                        <li>
                                                            <span onclick="showCode(1,this);">1 серия</span>
                                                            <span onclick="showCode(2,this);">2 серия</span>
                                                            <span onclick="showCode(3,this);">3 серия</span>
                                                            <span onclick="showCode(4,this);">4 серия</span>
                                                            <span onclick="showCode(5,this);">5 серия</span>
                                                            <span onclick="showCode(6,this);">6 серия</span>
                                                            <span onclick="showCode(7,this);">7 серия</span>
                                                            <span onclick="showCode(8,this);">8 серия</span>
                                                        </li>
                                                        
                                                        <li>
                                                            <span onclick="showCode(9,this);">9 серия</span>
                                                            <span onclick="showCode(10,this);">10 серия</span>
                                                            <span onclick="showCode(11,this);">11 серия</span>
                                                            <span onclick="showCode(12,this);">12 серия</span>
                                                            <span onclick="showCode(13,this);">13 серия</span>
                                                            <span onclick="showCode(14,this);">14 серия</span>
                                                            <span onclick="showCode(15,this);">15 серия</span>
                                                            <span onclick="showCode(16,this);">16 серия</span>
                                                        </li>
                                                        
                                                        <li>
                                                            <span onclick="showCode(17,this);">17 серия</span>
                                                            <span onclick="showCode(18,this);">18 серия</span>
                                                            <span onclick="showCode(19,this);">19 серия</span>
                                                            <span onclick="showCode(20,this);">20 серия</span>
                                                            <span onclick="showCode(21,this);">21 серия</span>
                                                            <span onclick="showCode(22,this);">22 серия</span>
                                                        </li>
                                                    </ul>
                                                </div>
                                                
                                            </div>

                                            <div id="episodes-2" class="tvs_slides_wrap tvs_slides_episodes">
                                                <div class="tvs_slides">
                                                    <ul>
                                                        <li>
                                                            <span onclick="showCode(23,this);">1 серия</span>
                                                            <span onclick="showCode(24,this);">2 серия</span>
                                                            <span onclick="showCode(25,this);">3 серия</span>
                                                            <span onclick="showCode(26,this);">4 серия</span>
                                                            <span onclick="showCode(27,this);">5 серия</span>
                                                            <span onclick="showCode(28,this);">6 серия</span>
                                                            <span onclick="showCode(29,this);">7 серия</span>
                                                            <span onclick="showCode(30,this);">8 серия</span>
                                                        </li>
                                                        
                                                        <li>
                                                            <span onclick="showCode(31,this);">9 серия</span>
                                                            <span onclick="showCode(32,this);">10 серия</span>
                                                            <span onclick="showCode(33,this);">11 серия</span>
                                                            <span onclick="showCode(34,this);">12 серия</span>
                                                            <span onclick="showCode(35,this);">13 серия</span>
                                                            <span onclick="showCode(36,this);">14 серия</span>
                                                            <span onclick="showCode(37,this);">15 серия</span>
                                                            <span onclick="showCode(38,this);">16 серия</span>
                                                        </li>
                                                        
                                                        <li>
                                                            <span onclick="showCode(39,this);">17 серия</span>
                                                            <span onclick="showCode(40,this);">18 серия</span>
                                                            <span onclick="showCode(41,this);">19 серия</span>
                                                            <span onclick="showCode(42,this);">20 серия</span>
                                                            <span onclick="showCode(43,this);">21 серия</span>
                                                            <span onclick="showCode(44,this);">22 серия</span>
                                                        </li>
                                                    </ul>
                                                </div>
                                                
                                            </div>
                                            
                                            <div id="episodes-3" class="tvs_slides_wrap tvs_slides_episodes">
                                                <div class="tvs_slides">
                                                    <ul>
                                                        <li>
                                                           <span onclick="showCode(45,this);">1 серия</span>
                                                           <span onclick="showCode(46,this);">2 серия</span>
                                                           <span onclick="showCode(47,this);">3 серия</span>
                                                        </li>
                                                    </ul>
                                                </div>
                                            
                                            </div>


Что мне в этом коде нужно исправить, что бы получилось вот такое к примеру. Я нажимаю на "2 серия", и код серии передается вот сюда

 <div id="episode-code">здесь код серии, что прописан во 2 серии</div>

Комментарии пользователей (4)

4ortic
26 | 2

4ortic - 19 октября 2015 04:18 - Юзер

Спасибо конечно. Но это не то что мне нужно

vitnet
218

2171 | 930

vitnet - 19 октября 2015 13:23 - Эксперт

Будет проще если вы оставите ссылку на сайт откуда брали скрип.

Кому интересно может достать с исходника

Recto
23

80 | 26

Recto - 19 октября 2015 08:35 - Юзер

<script type="text/javascript">
    function strpos(haystack, needle, offset) {
        var i = haystack.indexOf(needle, offset);
        return i >= 0 ? i : false;
    }

    $(function() {
        $('#serial_selector').delegate('li:not(.pcurrent)', 'click', function() {
            $(this).addClass('pcurrent').siblings().removeClass('pcurrent');
            if (strpos($(this).attr('data-src'), '') === false) {
                $("#mcode_block").html($(this).attr('data-src')).slideDown(400);
                $("#film_main").removeAttr('src').slideUp(400);
            } else {
                $("#film_main").attr('src', $(this).attr('data-src')).slideDown(400);
                $("#mcode_block").html('').slideUp(400);
            }
            $.get(dle_root + 'engine/ajax/marked_serial.php',{news_id:38,id:$('.pcurrent').index()});
        });
        $.get(dle_root + 'engine/ajax/marked_serial.php',{news_id:38,method:'get'}, function(d) {
            $('#serial_selector li').removeClass('.pcurrent').eq(d).addClass('pcurrent');
            $('#serial_selector').animate({scrollTop:$('.pcurrent').index()*23});
            var src = $('#serial_selector li').eq(d).attr('data-src');
            if (strpos(src, 'http') === false) {
                $("#mcode_block").html(src).slideDown(400);
                $("#film_main").removeAttr('src').slideUp(400);
            } else {
                $("#film_main").attr('src', src).slideDown(400);
                $("#mcode_block").html('').slideUp(400);
            }
        });
    })
</script>



<iframe name="film_main" id="film_main" src="{ser_last}" width="756px" height="360" frameborder="0" allowfullscreen="" scrolling="no"></iframe>


    <ul id="serial_selector" >
<li data-src="//rutube.ru/play/embed/8039301"><span ></span> 1 Серия</li>
<li data-src="//rutube.ru/play/embed/8039301"><span ></span> 2 Серия</li>
<li data-src="//rutube.ru/play/embed/8039301"><span ></span> 3 Серия</li>
    </ul>

4ortic
26 | 2

4ortic - 18 ноября 2015 03:08 - Юзер

vitnet,
Скажите пожалуйста как сделать что бы добавление было не как в оригинале, а серии вписывать вот так

<span onclick="showCode(код серии);">1 серия</span>
<span onclick="showCode(код серии);">2 серия</span>
<span onclick="showCode(код серии);">3 серия</span>
<span onclick="showCode(код серии);">4 серия</span>
<span onclick="showCode(код серии);">5 серия</span>
<span onclick="showCode(код серии);">6 серия</span>
<span onclick="showCode(код серии);">7 серия</span>
Спасибо

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

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