html - Mobile bootstrap navbar button not collapsing -

-



i know has been posted tons of times still cannot find solution. have tried viewing on mobile , shrinking browser nav collapse button isn't "collapsing." followed guidance provided other posts none have worked. have set data-target correct id , have of scripts sourced.

my code:

nav ul li{      width:117px;  }  nav{      box-shadow: 15px 0px 45px #1f2021;  }  .navbar-fixed-top{      position:absolute!important;  }
<!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">    <meta name="viewport" content="width=device-width, initial-scale=1,       minimum-scale=1, maximum-scale=1" />      <!-- above 3 meta tags *must* come first in head; other head content must come *after* these tags -->    <title>title</title>      <!-- bootstrap -->    <link href="css/blog.css" rel="stylesheet" type="text/css">    <link href="css/bootstrap.min.css" rel="stylesheet">    <link href="css/starter-template.css" rel="stylesheet" type="text/css">    <link rel="stylesheet" media="only screen , (min-width:1261px)" href="css/custom.css">    <link rel="stylesheet" media="only screen , (min-width:781px) ,       (max-width:1260px)" href="css/tablet.css">    <link rel="stylesheet" media="only screen , (max-width:780px)" href="css/mobile.css">    <script src="jquery-3.2.1.js"></script>    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js">    </script>    <script>      window.jquery || document.write('<script           src = "../../assets/js/vendor/jquery.min.js" > < \/script>')    </script>    <script src="../../dist/js/bootstrap.min.js"></script>    <!-- ie10 viewport hack surface/desktop windows 8 bug -->    <script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>    <link rel="manifest" href="manifest.json">    <meta name="msapplication-tilecolor" content="#ffffff">    <meta name="msapplication-tileimage" content="ms-icon-144x144.png">    <meta name="theme-color" content="#ffffff">  </head>  <body>    <div id="main-content">      <nav class="navbar navbar-inverse navbar-fixed-top">        <div class="logospace">          <center> <img id="logo" src="img/logo.png"><br /></center>        </div>        <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">toggle navigation</span>              <span class="icon-bar"></span>              <span class="icon-bar"></span>              <span class="icon-bar"></span>            </button>          </div>            <div id="navbar" class="collapse navbar-collapse">            <ul class="nav navbar-nav">              <li><a href="index.html">home <span class="glyphicon glyphicon-home"       aria-hidden="true"></span></a></li>              <li><a href="about.html">about  <span class="glyphicon       glyphicon-plus" aria-hidden="true"></span></a></li>              <li class="active"><a href="roster.html">roster  <span       class="glyphicon glyphicon-user"></span></a></li>              <li><a href="history.html">history  <span class="glyphicon       glyphicon-list-alt"></span></a></li>              <li style="width:130px;float:left;"><a href="schedule.html">schedule <span class="glyphicon glyphicon-list">      </span></a></li>              <li><a href="photos.html">photos  <span class="glyphicon       glyphicon-camera" aria-hidden="true"></span></a></li>              <li><a href="videos.html">videos  <span class="glyphicon       glyphicon-film"></span></a></li>              <li><a href="coaches.html">coaches  <span class="glyphicon       glyphicon-book"></span></a></li>              <li><a href="contact.html">contact  <span class="glyphicon       glyphicon-send"></a></li>            </ul>          </div>          <!--/.nav-collapse -->        </div>      </nav>  </body>  </html>

you have few misplaced tags. missing </div> , </span>. 1 works.

div#navbar.navbar-collapse.collapse.in {      max-height:600px  }  nav{      box-shadow: 15px 0px 45px #1f2021;  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>  <!-- fixed navbar -->  <nav class="navbar navbar-inverse navbar-fixed-top">    <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">toggle navigation</span>              <span class="icon-bar"></span>              <span class="icon-bar"></span>              <span class="icon-bar"></span>            </button>        <a class="navbar-brand" href="#">project name</a>      </div>      <div id="navbar" class="navbar-collapse collapse">        <ul class="nav navbar-nav">          <li><a href="index.html">home <span class="glyphicon glyphicon-home"   aria-hidden="true"></span></a></li>          <li><a href="about.html">about  <span class="glyphicon   glyphicon-plus" aria-hidden="true"></span></a></li>          <li class="active"><a href="roster.html">roster  <span   class="glyphicon glyphicon-user"></span></a></li>          <li><a href="history.html">history  <span class="glyphicon   glyphicon-list-alt"></span></a></li>          <li><a href="schedule.html">schedule <span class="glyphicon glyphicon-list">  </span></a></li>          <li><a href="photos.html">photos  <span class="glyphicon   glyphicon-camera" aria-hidden="true"></span></a></li>          <li><a href="videos.html">videos  <span class="glyphicon   glyphicon-film"></span></a></li>          <li><a href="coaches.html">coaches  <span class="glyphicon   glyphicon-book"></span></a></li>          <li><a href="contact.html">contact  <span class="glyphicon   glyphicon-send"></span></a></li>        </ul>        </div>      <!--/.nav-collapse -->    </div>  </nav>    <div class="container">      <div class="jumbotron">      <h1>navbar example</h1>      <p>this example quick exercise illustrate how fixed top navbar work. includes responsive css , html, adapts viewport , device.</p>    </div>  </div>    <!-- /container -->





wiki

Comments

Post a Comment

Popular posts from this blog

python - Read npy file directly from S3 StreamingBody -

-
i have many .npy (numpy) , .json files saved in s3, need download , load these files. for json files downloading files , loading dictionary using following code: obj = s3.object(bucket, key) response = obj.get() body = response['body'].read().decode('utf-8') data = json.loads(body) that way avoid writing .json file disk , reading it. now want same .npy files, equivalent? currently downloading file, saving temp file on disk , loading np.load avoid if possible. following https://stackoverflow.com/a/28196540/3509999 : obj = s3.object(bucket, key) io.bytesio(obj.get()["body"].read()) f: # rewind file f.seek(0) arr = np.load(f) wiki
Read more

python - Minimize function with Scipy minimize -

-
trying obtain d value (integer) std_diff objective function minimal, using scipy minimize. my code: def std_diff(d): return std(diff(df['bn'].values,d)); scipy.optimize import minimize b=(3,) res = minimize(std_diff,(1,), method='slsqp', bounds = b) **df['bn'].values** out[72]: array([ 2, 2, 2, 2, 3, 2, 7, 5, 7, 11, 8, 2, 11, 7, 15, 8, 7, 12, 21, 19, 32, 35, 40, 35, 21, 19, 25, 20, 40, 80, 99], dtype=int64) error is"indexerror: many indices array " in case not use bounds : res = minimize(std_diff,(1,), method='slsqp'), error: > in _minimize_slsqp(func, x0, args, jac, bounds, constraints, maxiter, > ftol, iprint, disp, eps, callback, **unknown_options) > 368 fx = float(np.asarray(func(x))) > 369 except: > --> 370 raise valueerror("objective function must return scalar") > 371 # compute constraints > 3
Read more

kotlin - Out-projected type in generic interface prohibits the use of metod with generic parameter -

-
i start using kotlin , defined interface this: interface aadapter<vh : recyclerview.viewholder> { fun oncreateaviewholder(parent: viewgroup): vh fun onbindaviewholder(v: vh, position: int) } and when try use on code: class klasa ( private val adapter: aadapter<*> ) { fun dosth(){ //... val vh = this.adapter.oncreateaviewholder(parent) //on below line error adapter.onbindaviewholder(v, position) //... } } i error out-projected type 'aadapter<*>' prohibits use of 'public abstract fun onbindaviewholder(v: t, position: int): unit i tied add "in" or "out" definition i'm confused. how allow it. replace aadapter<*> aadapter<recyclerview.viewholder> . class klasa ( private val adapter: aadapter<recyclerview.viewholder> ) { // ... because have declared aadapter has type parameter vh type subclass of recyclerview.
Read more