Bootstrap javascript wordpress issue data-toggle =“collapse”

时间:2014-12-20 00:37:10

标签: javascript jquery css wordpress twitter-bootstrap

我遇到了项目问题。

这是我做的第一个wordpress博客,想法是html网站www.humantools.com.mx并为它建立一个博客www.humantools.com.mx/blog我有一个奇怪的问题,当上课时=" navbar-toggle崩溃"数据肘节="崩"在导航栏中效果很好,在网站上运行良好......

当我退出时,通常带有colapssed菜单的导航项链接到"#"

这很奇怪,我真的很喜欢这个,请帮助,我添加了css和标题代码,如果您还需要其他任何内容请告诉我。


标题               

          /**

          * The Header template for our theme

          *

          * Displays all of the <head> section and everything up till <div id="main">

          *

          * @package WordPress

          * @subpackage Twenty_Thirteen

          * @since Twenty Thirteen 1.0

          */

          ?>

          <!--[if IE 7]>

          <html class="ie ie7" <?php language_attributes(); ?>>

          <![endif]-->

          <!--[if IE 8]>

          <html class="ie ie8" <?php language_attributes(); ?>>

          <![endif]-->

          <!--[if !(IE 7) & !(IE 8)]><!-->

          <html <?php language_attributes(); ?>>

          <!--<![endif]-->

          <head>

          <meta charset="utf-8">

          <meta http-equiv="X-UA-Compatible" content="IE=edge">

          <meta name="viewport" content="width=device-width, initial-scale=1">

          <meta name="description" content="">

          <meta name="author" content="">

          <link rel="icon" href="http://www.humantools.com.mx/img/favicon.png">



          <title>Human Tools</title>


          <!-- Bootstrap core JavaScript

          ================================================== -->

          <!-- Placed at the end of the document so the pages load faster -->

          <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

          <script src="http://www.humantools.com.mx/dist/js/bootstrap.min.js"></script>

          <script src="http://www.humantools.com.mx/assets/js/docs.min.js"></script>

          <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->

          <script src="http://www.humantools.com.mx/assets/js/ie10-viewport-bug-workaround.js"></script>
          <script>

          (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){

          (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),

          m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)

          })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

          ga('create', 'UA-56728201-1', 'auto');

          ga('send', 'pageview');

          </script>



          <!-- Bootstrap core CSS -->

          <link href="http://www.humantools.com.mx/dist/css/bootstrap.min.css" rel="stylesheet">

          <!-- Custo Fonts -->

          <link href='http://fonts.googleapis.com/css?family=Titillium+Web:200,400,300,700,600' rel='stylesheet' type='text/css'>

          <!-- Custom styles for this template -->

          <link href="http://www.humantools.com.mx/style.css" rel="stylesheet">

          <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->

          <!--[if lt IE 9]><script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>

          <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>

          <![endif]-->

          <meta charset="<?php bloginfo( 'charset' ); ?>">

          <meta name="viewport" content="width=device-width">

          <title><?php wp_title( '|', true, 'right' ); ?></title>

          <link rel="profile" href="http://gmpg.org/xfn/11">

          <link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">

          <!--[if lt IE 9]>

          <script src="<?php echo get_template_directory_uri(); ?>/js/html5.js"></script>

          <![endif]-->

          <?php wp_head(); ?>

          </head>

          <?php echo '<body class="'.join(' ', get_body_class()).'">'.PHP_EOL; ?>

          <!-- NAVBAR

          ================================================== -->

          <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">

          <div class="container">

          <div class="navbar-header">

            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">

              <span class="sr-only">Menú</span>

              <span class="icon-bar"></span>

              <span class="icon-bar"></span>

              <span class="icon-bar"></span>

            </button>

            <a class="navbar-brand" href="http://www.humantools.com.mx/"><img src="http://www.humantools.com.mx/img/logo-humantools.png"></a>

          </div>

          <div id="navbar" class="navbar-collapse collapse">

            <ul class="nav navbar-nav navbar-right">

              <li><a href="http://www.humantools.com.mx/quienessomos.html">Quiénes<br>Somos</a></li>

              <li><a href="#" data-toggle="dropdown">Soluciones<br>para Empresas <span class="caret"></span></a>

                <ul class="dropdown-menu" role="menu">

                  <li><a href="http://www.humantools.com.mx/outsourcing.html">Outsourcing <br>de Nómina</a></li>

                  <li class="divider"></li>

                  <li><a href="http://www.humantools.com.mx/procesamiento.html">Procesamiento <br>de Nómina</a></li>

                </ul>

              </li>

              <li><a href="http://www.humantools.com.mx/contacto.html">Info &<br>Contacto</a></li>

              <li><a href="http://www.humantools.com.mx/faq.html">Preguntas<br>Frecuentes</a></li>

              <li><a href="http://www.humantools.com.mx/avisodeprivacidad.html">Aviso de<br>Privacidad</a></li>

                          <li><a href="http://www.humantools.com.mx/blog">Blog<br><br></a></li>



            </ul>

          </div><!--/.nav-collapse -->

          </div>

          </nav>



          <!-- CONTENIDO

          ================================================== -->



          <div class="container">

          <div class="col-lg-9"> <!-- titulo blog --> 

CSS

            /*
            Theme Name:HumanTools.
            Theme URI: www.humantools.com.mx
            Description: Human Tools blog.
            Version: 1.0
            Author: Raul Salazar 
            Author URI: www.bybrave.com
            */
            body {
              padding-top: 70px;
              padding-bottom: 0px;
              font-family: 'Titillium Web', sans-serif;
            }

            .home {
                margin-bottom: 50px;
            }

            .interior {
                margin-bottom: 50px;
            }

            h1 {
              font-family: 'Titillium Web', sans-serif;
              text-align: left;
              text-decoration: none;
              font-size: 55px;
              font-weight: 200;
            }

            h2 {
              font-family: 'Titillium Web', sans-serif;
              color: #0876bb;
              text-align: left;
              text-decoration: none;
              font-size: 24px;
              font-weight: 400;
            }

            h3 {
                font-size: 40px;
                margin: 15% 0% 9% 0%;
            }

            h4 {
                font-size: 26px;
                margin-top: -5px;
            }

            .img-responsive {
                width: 100%;
            }

            .faq-divider {
                color: #adadad;
                margin-top: 30px;
                margin-bottom: 0px;
            }

NAV STARTS

                     .navbar {
                      min-height: 78px;
            }

            .navbar-inverse {
                background-color: #212121;
            }

            .navbar-nav>li>a {
                padding-top: 10px;
                padding-bottom: 10px;
                line-height: 120%;
            }

            .nav>li {
                margin-top: 15px;
                margin-bottom: 15px;
                border-left: solid 1px #0876bb;
                border-spacing: 10px;
                padding: 0 15px;
            }

            li {
                font-size: 12px;
            }

            .navbar-toggle {
                margin-top: 20px;
            }

            .navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:hover,        .navbar-inverse .navbar-nav>.open>a:focus {
                background-color: #212121;
            }

            .dropdown-menu {
                background-color: #888;
                border-radius: 0px;
                box-shadow: none;
                min-width: 150px;
            }

            .dropdown-menu>li>a {
                color: #FFF;
            }

            .dropdown-menu>li>a:hover {
                color: #FFF;
                background-color: #0876bb;
                margin: 0 0 0 0;
            }

            .navbar-nav>li>.dropdown-menu {
                margin-top: 15px;
            }

NAV ENDS

            /* blog */
            div .date {
            margin: 40% 0px 0px 55%;
            font-size: 18px;
            }

            .blog6 { max-height:100%;
            max-width:100%;
            }
            .contenidoblog {
                text-align: justify;
                font-size:1.2em;
            }
            .tag {
            font-size:16px;}
            .bluetag {
                color: #0876bb;
            font-size:16px;
            }

            .masblog { font-size:18px; text-transform:capitalize;
            margin-bottom:30px;}

            .sidebar {margin-top: 10%; }
            /*end blog*/
            /* CUSTOMIZE THE CAROUSEL
            -------------------------------------------------- */

            /* Carousel base class */
            .carousel {
              height: 440px;
              margin-bottom: 60px;
            }
            /* Since positioning the image, we need to help out the caption */
            .carousel-caption {
              z-index: 10;
              text-align: left;
              text-shadow: none;
              top: 40px;
              left: 5%;
            }

            /* Declare heights because of positioning of img element */
            .carousel .item {
              height: 440px;
              background-color: #0876bb;
              background-image: url(img/slide-01.jpg);
              background-repeat: no-repeat;
              background-position: center;
            }
            .carousel-inner > .item > img {
              min-width: 1024px;
              height: 440px;
              vertical-align: middle;
            }

            .carousel-control {
                height: 510px;
            }

            /* CUSTOMIZE QUOTES
            -------------------------------------------------- */
            .quotes {
               margin-top: -10px;
            }

            hr {
                color: #adadad;
                margin-top: 40px;
                margin-bottom: 40px;
            }

            .quote {
                border: solid 1px #adadad;
                border-radius: 15px;
                margin-bottom: 50px;
                padding: 30px 30px;
            }

            #quote-img {
                position: absolute;
                top: 30px;
                left: 5px;
                width: 29px;
                height: 29px;
                background-image: url('img/quote-left.png');
                background-repeat: no-repeat;
            }

            #quote-img2 {
                position: absolute;
                top: 30px;
                right: 5px;
                width: 29px;
                height: 29px;
                background-image: url('img/quote-right.png');
                background-repeat: no-repeat;
            }

            #quote-img3 {
                position: absolute;
                bottom: 27px;
                left: 50px;
                width: 36px;
                height: 25px;
                background-image: url('img/quote-corner.png');
                background-repeat: no-repeat;
            }

            /* CUSTOMIZE INTERIORS
            -------------------------------------------------- */

            .blue {
                color: #0876bb;
            }

            .grey {
                color: #888888;
                margin-left: -15px;
                margin-bottom: 10px;
                margin-top: -20px;
            }

            .subheading {
                font-size: 18px;
                font-weight: 400;
                padding-top: 30px;
            }

            .contenido {
                text-align: justify;
            }

            ul {
                list-style-type: none;
                padding: 0px;
                margin: 20px 0 20px 0;
            }

            ul li.bullet-01 {
                background-image: url(img/bullet-01.jpg);
                background-repeat: no-repeat;
                background-position: 0px 22px; 
                padding: 15px 0 15px 40px;
                font-size: 13px;
                text-align: justify;
            }

            ul li.bullet-02 {
                background-image: url(img/bullet-02.png);
                background-repeat: no-repeat;
                background-position: 10px 22px; 
                padding: 15px 0 15px 40px;
                font-size: 13px;
                text-align: justify;
            }

            ul li.bullet-a {
                background-image: url(img/bullet-a.png);
                background-repeat: no-repeat;
                background-position: 0px 14px; 
                padding: 15px 0 15px 40px;
                font-size: 13px;
                text-align: justify;
            }

            ul li.bullet-b {
                background-image: url(img/bullet-b.png);
                background-repeat: no-repeat;
                background-position: 0px 14px; 
                padding: 15px 0 15px 40px;
                font-size: 13px;
                text-align: justify;
            }

            ul li.bullet-c {
                background-image: url(img/bullet-c.png);
                background-repeat: no-repeat;
                background-position: 0px 14px; 
                padding: 15px 0 15px 40px;
                font-size: 13px;
                text-align: justify;
            }

            .img-responsive {
                margin-top: 30px;
            }

            /* CUSTOMIZE FORM
            -------------------------------------------------- */

            .form-control {
                background-color: #eaeaea;
                box-shadow: none;
                border-radius: 0px;
                height: 50px;
                border: none;
            }
            .btn {
                background-color: #0876bb;
                border-radius: 0px;
                border: none;
                margin-right: -15px;
                padding: 20px 30px;
            }

            /* CUSTOMIZE FOOTER
            -------------------------------------------------- */

            .footer {
              position: relative;
              bottom: -31;
              width: 100%;
              /* Set the fixed height of the footer here */
              height: 75px;
              background-color: #212121;
            }

            .f1 {
                font-size: 11px;
                padding: 30px 0 20px 25px;
                color: #fff;
                font-weight: 200;
                letter-spacing: .5px
            }

            .f1 a {
                color: #fff;
            } 

            .f1 em {
                color: #0876bb;
            }

            .text-mutted {
                font-size: 11px;
                color: #888;
                    padding: 30px 0 20px 0px;
            }


            @media (max-width: 990px) {
                #quote-img3 {
                    bottom: -23px;
                }

                .f1 {
                padding: 20px 0 0 0;
                width: 60%;
                }
            }

            @media (max-width: 700px) {

                .copyright {
                    margin-top: 130px;
                }

                .f1 {
                padding: 20px 0 0 0;
                width: 100%;
                }
            }

            function mbe_wp_head(){
                echo '<style>'.PHP_EOL;
                echo 'body{ padding-top: 70px !important; }'.PHP_EOL;
                // Using custom CSS class name.
                echo 'body.body-logged-in .navbar-fixed-top{ top: 28px !important; }'.PHP_EOL;
                // Using WordPress default CSS class name.
                echo 'body.logged-in .navbar-fixed-top{ top: 28px !important; }'.PHP_EOL;
                echo '</style>'.PHP_EOL;
            } 

            #respond { 
            background: #ffffff;
            padding:10px;
            margin-top:-15%;
            }

            /* Highlight active form field */

            #respond input[type=text], textarea {
              -webkit-transition: all 0.30s ease-in-out;
              -moz-transition: all 0.30s ease-in-out;
              -ms-transition: all 0.30s ease-in-out;
              -o-transition: all 0.30s ease-in-out;
              outline: none;
              padding: 3px 0px 3px 3px;
              margin: 30px 1px 3px 0px;
              border: 1px solid #DDDDDD;
            }


            #respond input[type=text]:focus, textarea:focus {
              box-shadow: 0 0 5px rgba(81, 203, 238, 1);
              margin: 5px 1px 3px 0px;
              border: 1px solid rgba(81, 203, 238, 1);
            }

            #author { 
            font-family: Lobster, "Lobster 1.4", "Droid Sans", Arial;
            font-size: 16px;
            color:#1d1d1d; 
            letter-spacing:.1em;
            } 

            #url  { 
            color: #21759b;
            font-family: "Luicida Console", "Courier New", "Courier", monospace; 
            } 

            #submit {
            font-family: Arial;
            color: #ffffff;
            font-size: 20px;
            padding: 10px;
            text-decoration: none;
            border:0px;
            border-top: 2px solid #0992e6;
            background: #0773b5;
            } 

            #submit:hover {
              background: #0869a4;
                border-top: 0px;
              border-bottom: 2px solid #0992e6;
            text-shadow: 0px;
            color:#cecece;
            }

            #commentform > p.logged-in-as {margin-bottom: 20px;}

1 个答案:

答案 0 :(得分:4)

这3个文件返回404。您可以在浏览器中看到这些购买开放JavaScript console

  

http://www.humantools.com.mx/prueba/dist/js/bootstrap.min.js   http://www.humantools.com.mx/prueba/assets/js/docs.min.js   http://www.humantools.com.mx/prueba/assets/js/ie10-viewport-bug-workaround.js

最重要的文件是 bootstrap.min.js ,需要包含在内。您应该像这样在项目中包含引导程序 - 确保将其包含在您所说的目录中:https://github.com/pjhampton/BigBooty/blob/master/lib/framework/enqueue.php