Dropdown does not work in android browser [closed]

2

Hello, I have a problem with HTML bootstrap, my dropdown does not work on mobile phones. It will be that someone can help me.

      

<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script>
        window.jQuery || document.write('<script src="js/jquery-1.7.1.min.js"><\/script>')
    </script>
    <script type="text/javascript" src="js/bootstrap.js"></script>

    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/bootstrap-responsive.css">
    <link rel="stylesheet" href="css/estilo.css">

                                                                                

        <div class="carousel-caption">

                <h4><a id="carousel" href=" ">Testando o carrocel </h4>

                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Reiciendis inventore nulla maiores dicta odio quisquam consequuntur</p>
                </a>
                </div>
            </div>
            <div class="item">
                <img src="img/teste05.jpg" class="imagem">
                <div class="carousel-caption">
                    <h4>Testando </h4>
                    <p>Veja noticias sobre a Marcha para Jesus</p>
                </div>
            </div>
            <div class="item"><img src="img/teste03.jpg" class="imagem"></div>
        </div>
      <!-- Navegador do carousel -->
      <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
      <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
    </div>
</div>

<!-- Noticias com Imagens com tamanho de 300 X 200-->
<section>
    <div class="row-fluid">
    <ul class="thumbnails">
        <li class="offset1 span3">
            <div class="thumbnail">
                <img src="img/teste03.jpg">
                <h3>Marcha a todo Vapor!</h3>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Magnam accusantium vitae aut cumque iusto est... </p>
            </div>
        </li>
        <li class="span4">
            <div class="thumbnail">
                <img src="img/teste02.jpg" alt="">
                <h3>Rótulo para a miniatura</h3>
                <p>Texto do thumbnail...</p>
            </div>
        </li>
        <li class="span3">
            <div class="thumbnail">
                <img src="img/teste04.jpg" alt="">
                <h3>Rótulo para a miniatura</h3>
                <p>Texto do thumbnail...</p>
            </div>
        </li>
    </ul>
    </div>
</section>
    <script type="text/javascript">
    $('.carousel').carousel({
        interval: 5000
}
</script>
<?php
    include "rodape.php";
?>

<script type="text/javascript">
    $(function(){
        $(".dropdown-toggle").click(function(){
            $(this).dropdown('toggle');
        });
    });    
</script>

topo.php

<header>
<div class="row Logo">
        <div class="span12">
            <img src="img/logo.jpg" id="logo" />
            <!-- <span class="pull-right"><h4>f  t</h4></span> -->
        </div>
    </div>
<nav class="navbar">
    <div class="navbar-inner">
        <div class="container">
            <button class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
                <a href="" class="brand pull-right">IPI Alterosa</a>
            <div class="nav-collapse collapse">
                <ul class="nav">
                    <!--   -->
                    <li><a href="index.php">Home</a></li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" id="dLabel" role="button">
                            Institucional
                            <b class="caret"></b>
                        </a>
                            <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
                                <li><a href="historia.php">História</a></li>
                                <li><a href="">Quem Somos</a></li>
                                <li><a href="">Endereços</a></li>
                            </ul>
                    </li>

                    <li><a href="historia.php">Noticias</a></li>

                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                            Ministérios
                            <b class="caret"></b>
                        </a>
                        <ul class="dropdown-menu">
                            <li><a href="">Missão</a></li>
                            <li><a href="">Visitação</a></li>
                            <li><a href="">Louvor</a></li>
                        </ul>
                    </li>
                    <li><a href="localizacao.php">Onde estamos</a></li>
                    <li>
                        <a href="http://www.ipib.org/o-estandarte-1/o-estandarte-online" target="_blank"> 
                            Estandarte </a>
                    </li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                Contato
                                <b class="caret"></b>
                            </a>
                        <ul class="dropdown-menu">
                            <li><a href="pedidos.php">Pedidos de oração</a></li>
                            <li><a href="">Telefones</a></li>
                            <li><a href="">Fale Conosco</a></li>
                        </ul>
                    </li>   
                </ul>

            <div class="Pesquisa">
                    <form class="form-search">
                        <div class="input-append">
                            <input type="text" class="span2 search-query">
                            <button type="submit" class="btn btn-inverse"><i class="icon-search icon-white"></i></button>
                        </div>
                    </form> 
                </div>
            </div>
        </div>
    </div>

</nav>
</header>    
    
asked by anonymous 01.09.2015 / 02:32

1 answer

0

Recently in a project that uses mobile version I use the way below and it answered perfectly, including in the questions that involves responsive design.

    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                      <ul class="nav navbar-nav">
                        <li><a href="#" >Início</a></li>
                        <li><a href="#" >Sobre</a></li>
                        <li class="dropdown">
                          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" data-aria-haspopup="true" data-aria-expanded="false">Destinos<span class="caret"></span></a>
                          <ul class="dropdown-menu bg-black border-fff">
                             <li><a href="#">Teste1</a></li>
                             <li><a href="#">Teste2</a></li>
                          </ul>
                         </li>
                       </ul>
</div>
    
01.09.2015 / 03:31