JavaScript Code Incompatibility

2

I'm using a script to switch a block with Nav Tabs, the first part of the code works normally, but the part where I do the border-color request and game to the other field is only working in Chrome, could someone tell me Why?

JS:

            $(function(){
            $('#myTab a').click(function (e) {
                e.preventDefault();
                $(this).tab('show');
                var corbackground = $('#myTab>.active>a').css('border-color');
                $('.tab-content').css('border-color',corbackground);
            });
        });

HTML:

                                <ul class="nav nav-tabs" id="myTab">
                                    <li class="active"><a href="#peito">Peito</a></li>
                                    <li><a href="#biceps">Biceps</a></li>
                                    <li><a href="#costa">Costa</a></li>
                                    <li><a href="#triceps">Triceps</a></li>
                                </ul>
                                <div class="tab-content">
                                    <div class="tab-pane active" id="peito">
                                         <a href="#idphp" class="exercicio" title=""></a>
                                    </div>
                                    <div class="tab-pane" id="biceps">2</div>
                                    <div class="tab-pane" id="costa">3</div>
                                    <div class="tab-pane" id="triceps">4</div>
                                </div>
    
asked by anonymous 18.08.2014 / 13:59

1 answer

2

It has a small bug with IE and Firefox, and to get the border color it should ask for border-top-color , as in ex. below:

jquery:

$('#myTab a').click(function (e) {
    e.preventDefault();
    $('.tab-pane').not($(this).attr('href')).hide();
    $($(this).attr('href')).show();
    $('.tab-content').css('border-color', $(this).css('border-top-color'));
});

jsFiddle

    
18.08.2014 / 17:12