0

I'm using Bootstrap (last version 3.4.4) as my responsive framework. Also I am using jQuery v1.11.0.

My site is working ok in computers (Safari, Firefox, Chrome, IE), however when I try to open my site on phones, the responsive menu is not working. I can see the menu, the menu is collapsing ok, but when I click an option menu is not doing anything. The link doesn´t move to the selected option.

Its working ok in iPad and in some Android Phones, but in most of them is not working. I have tried in iPhone 4, 5, 6, and in BQ E5, BQ E6.

I researched a lot, I've tried different versions of Bootstrap, but cant find the solution to my problem. I hope you can help me.

My site is: http://mobile.solucionlegal.es/web/

And this is my script code:

<!-- Main Scripts-->
        <script src="js/jquery.js"></script>
        <script src="js/bootstrap.js"></script>
        <script src="js/custom.js"></script>
        <script src="js/jquery.nav.js"></script>
        <script src="js/wow.min.js"></script>
        <script src="js/rotator.js"></script>
        <!--<script src="js/scripts.js"></script>-->


        <script type="text/javascript">
                      $('a').click(function(){
                    $('html, body').animate({
                        scrollTop: $( $.attr(this, 'href') ).offset().top
                    }, 500);
                    return false;
                });
        </script>
        <script>
            $(document).ready(function() {
              $('#nav').onePageNav();

              $('.do').click(function(e) {
                $('#section-4').append('<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>');
                e.preventDefault();
              });
            });
        </script>
        <script type="text/javascript">$(document).on('click', '.panel-heading span.clickable', function (e) {
            var $this = $(this);
            if (!$this.hasClass('panel-collapsed')) {
                $this.parents('.panel').find('.panel-body').slideUp();
                $this.addClass('panel-collapsed');
                $this.find('i').removeClass('glyphicon-chevron-up').addClass('glyphicon-chevron-down');
            } else {
                $this.parents('.panel').find('.panel-body').slideDown();
                $this.removeClass('panel-collapsed');
                $this.find('i').removeClass('glyphicon-chevron-down').addClass('glyphicon-chevron-up');
            }
        });
        $(document).on('click', '.panel div.clickable', function (e) {
            var $this = $(this);
            if (!$this.hasClass('panel-collapsed')) {
                $this.parents('.panel').find('.panel-body').slideUp();
                $this.addClass('panel-collapsed');
                $this.find('i').removeClass('glyphicon-chevron-up').addClass('glyphicon-chevron-down');
            } else {
                $this.parents('.panel').find('.panel-body').slideDown();
                $this.removeClass('panel-collapsed');
                $this.find('i').removeClass('glyphicon-chevron-down').addClass('glyphicon-chevron-up');
            }
        });
        $(document).ready(function () {
            $('.panel-heading span.clickable').click();
            $('.panel div.clickable').click();
        });
    </script>
    <script>
        new WOW().init();
    </script>
    <script type="text/javascript">
        $(".rotate").textrotator({
        animation: "flip", // You can pick the way it animates when rotating through words. Options are dissolve (default), fade, flip, flipUp, flipCube, flipCubeUp and spin.
        separator: ",", // If you don't want commas to be the separator, you can define a new separator (|, &, * etc.) by yourself using this field.
        speed: 3000 // How many milliseconds until the next word show.
        });
    </script>
    <script type="text/javascript">
      // Close the navbar if collapsed (small screen) when clicking on a menu link
      // From edit 2 on
      // http://stackoverflow.com/questions/14203279/bootstrap-close-responsive-menu-on-click/23171593#23171593
      $(function () {
        $('.navbar-collapse ul li a:not(.dropdown-toggle)').bind('click touchstart', function () {
          $('.navbar-toggle:visible').click();
        });
      });
    </script>
APC
  • 144,005
  • 19
  • 170
  • 281
EGP
  • 1

0 Answers0