Bootstrap navbar toggle button not working correctly (HTML inside)

时间:2016-02-12 19:22:33

标签: html twitter-bootstrap menu toggle

When i open my site on lower resolutions (<768px) the menu button (3 bars) shows up, but when i click it it doesnt show the collapsed navbar. What am i doing wrong? I think ive linked everything correctly.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Lol-Smurfs.com | Squidat</title>
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <link href="estilo1.css" rel="stylesheet">
    <link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">
    <link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,900,700,600italic,600,200,200italic,300,300italic,400italic,700italic,900italic' rel='stylesheet' type='text/css'>
    <link href="favicon.ico" rel="icon" type="image/x-icon">
  </head>
  <body>
    <header>
      <center>
      <nav class="navbar navbar-default navbar-fixed-top">
        <div class="container">
          <div class="navbar-header navbar-left">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-1">
            <span class="sr-only">Menu</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            </button>
            <a href="#"><img src="logo.png"></a>
          </div>
          <div class="collapse navbar-collapse" id="navbar-1">
            <ul class="nav navbar-nav">
              <li><a href="#">Why us</a></li>
              <li><a href="#">About us</a></li>
              <li><a href="#">Pricing</a></li>
              <li><a href="#">FAQ</a></li>
              <li><a href="#">Blog</a></li>
              <li><a href="#">Reviews</a></li>
              <li><a href="#">Contact</a></li>
            </ul>
          </div>
        </div>
      </nav>
    </header>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>

2 个答案:

答案 0 :(得分:0)

Just replace your code with this.

    UIColor *greenColor = [UIColor greenColor];
    greenColor = [UIColor colorWithRed:.0 green:1 blue:.0 alpha:0.5];

    UIColor *grayColor = [UIColor grayColor];
    grayColor = [UIColor colorWithRed:.5 green:.5 blue:.5 alpha:0.5];

    UIColor *redColor = [UIColor redColor];
    redColor = [UIColor colorWithRed:1.0 green:.0 blue:.0 alpha:0.5];

    UIColor *yellowColor = [UIColor yellowColor];
    yellowColor = [UIColor colorWithRed:1.0 green:1.0 blue:.0 alpha:0.5];

    UIColor *orangeColor = [UIColor orangeColor];
    orangeColor = [UIColor colorWithRed:1.0 green:0.647 blue:.0 alpha:0.5];

    int direction = 0;
    if(index == 3){
        direction = 1;
        CGFloat currentEndAngle = atan2f(d_y, d_x);
        CGFloat actualEndAngle = -0.49234065359; //was M_PI

        if(fabs(currentEndAngle*180/M_PI) <= 91){
            // Draw the optimal arc
            //[self drawArc:ourPoint.startPosition andEndAngle:actualEndAngle andRadius:radius andColor:grayColor andDirection:direction withContext:context];

            if(currentEndAngle > 0 || currentEndAngle > actualEndAngle){
                // Draw the current green arc
                if(currentEndAngle - actualEndAngle < 0.6){
                    [self drawArc:ourPoint.startPosition andEndAngle:currentEndAngle andRadius:radius andColor:orangeColor andDirection:direction withContext:context];
                }
                else{
                    [self drawArc:ourPoint.startPosition andEndAngle:currentEndAngle andRadius:radius andColor:greenColor andDirection:direction withContext:context];
                }

            }
            else{
                // Draw the current red arc
                [self drawArc:ourPoint.startPosition andEndAngle:currentEndAngle andRadius:radius andColor:redColor andDirection:direction withContext:context];
                missAngle += fabs(currentEndAngle-actualEndAngle);
            }
        }

答案 1 :(得分:0)

Was referring to the bootstrap.js in an invalid location

$ ./manage.py generatebooktemplate 
usage: manage.py generatebooktemplate [-h] [--version] [-v {0,1,2,3}]
                                      [--settings SETTINGS]
                                      [--pythonpath PYTHONPATH] [--traceback]
                                      [--no-color] --name NAME --width WIDTH
                                      --height HEIGHT --h-outer-margin
                                      H_OUTER_MARGIN --h-inner-margin
                                      H_INNER_MARGIN --v-outer-margin
                                      V_OUTER_MARGIN --v-inner-margin
                                      V_INNER_MARGIN --cols COLS --rows ROWS
manage.py generatebooktemplate: error: argument --name is required

Here is the fix:

    <script src="js/bootstrap.min.js"></script>

相关问题