javascript - Bootstrap 3 button dropdown displays list items -
i'm trying implement bootstrap button dropdown. followed directions docs:
<div class="btn-group"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">action <span class="caret"></span></button> <ul class="dropdown-menu"> <li><a href="#">action</a></li> <li><a href="#">another action</a></li> <li><a href="#">something else here</a></li> <li role="separator" class="divider"></li> <li><a href="#">separated link</a></li> </ul> </div>
the dropdown displays list items on page:
any ideas i'm doing wrong?
working fine when include boostrap files, may missed css
<!doctype html> <html lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <meta charset="utf-8"> <title>bootply snippet - bootply bootstrap preview</title> <meta name="generator" content="bootply" /> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="description" content="" /> <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <!-- css code bootply.com editor --> </head> <!-- html code bootply.com editor --> <body > <div class="btn-group"> <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">action <span class="caret"></span></button> <ul class="dropdown-menu"> <li><a href="#">action</a></li> <li><a href="#">another action</a></li> <li><a href="#">something else here</a></li> <li role="separator" class="divider"></li> <li><a href="#">separated link</a></li> </ul></div> <script type='text/javascript' src="//ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> <script type='text/javascript' src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </body> </html>
Comments
Post a Comment