Vote count:
-1
I'm currently using this theme http://ift.tt/1um0OBq to create a mobile website. I'm trying to implement a modal but it doesn't seem to be working with this theme. I have the proper code implemented in my CSS and JS file, what could be wrong?
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<title>Storystrap Template</title>
<meta name="generator" content="Bootply" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link href="css/styles.css" rel="stylesheet">
</head>
<body>
<header class="navbar navbar-bright navbar-fixed-top" role="banner">
<div class="container">
<div class="navbar-header">
<a href="/" class="navbar-brand">Profile</a>
<a href="/" class="navbar-brand">About</a>
<a href="/" class="navbar-brand">Logout</a>
</div>
</div>
</header>
<div id="masthead">
<div class="container">
<div class="row">
<div class="col-md-7">
<h1>UberHungry
<p class="lead"></p>
</h1>
</div>
<div class="col-md-5">
<div class="well well-lg">
<div class="row">
<div class="col-sm-12">
<h2>Ready to eat?</h2>
</div>
</div>
</div>
</div>
</div>
</div><!-- /cont -->
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="top-spacer"> </div>
</div>
</div>
</div><!-- /cont -->
</div>
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="panel">
<div class="panel-body">
<!--/stories-->
<div class="row">
<br>
<div class="col-md-2 col-sm-3 text-center">
<a class="story-title" href="#"><img alt="" src="http://ift.tt/1xEEsGF" style="width:100px;height:100px" class="img-circle"></a>
</div>
<div class="col-md-10 col-sm-9">
<h3>In n Out</h3>
<div class="row">
<div class="col-xs-9">
<h4><span class="label label-default">4 spots left</span></h4><h4>
<small style="font-family:courier,'new courier';" class="text-muted">Leaves at 1PM • <a href="#" class="text-muted">Returns at 2PM</a></small>
</h4>
</div>
<div class="col-xs-3">
<button type ="button" class="btn btn-primary pull-right btnNext" data-toggle="modal" data-target="#moreModal">More <i class="glyphicon glyphicon-chevron-right"></i></button>
<!-- <ul>
<li></li>
</ul> -->
</div>
</div>
<br><br>
</div>
</div>
<hr>
<!--/stories-->
</div>
</div>
</div><!--/col-12-->
</div>
<div class="modal" id="moreModal" tabindex="-1" role="dialog" aria-labelledby="moreModal" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-header">
<p>did it work</p>
</div>
</div>
</div>
</div>
<hr>
<div class="container" id="footer">
<div class="row">
<div class="col col-sm-12">
<h1>Follow Us</h1>
<div class="btn-group">
<a class="btn btn-twitter btn-lg" href="#"><i class="icon-twitter icon-large"></i> Twitter</a>
<a class="btn btn-facebook btn-lg" href="#"><i class="icon-facebook icon-large"></i> Facebook</a>
<a class="btn btn-google-plus btn-lg" href="#"><i class="icon-google-plus icon-large"></i> Google+</a>
</div>
</div>
</div>
</div>
<hr>
<hr>
<footer>
<div class="container">
<div class="row">
<div class="col-sm-6">
<ul class="list-inline">
<li><i class="icon-facebook icon-2x"></i></li>
<li><i class="icon-twitter icon-2x"></i></li>
<li><i class="icon-google-plus icon-2x"></i></li>
<li><i class="icon-pinterest icon-2x"></i></li>
</ul>
</div>
<div class="col-sm-6">
<p class="pull-right">Built with <i class="icon-heart-empty"></i> at <a href="http://www.bootply.com">Bootply</a></p>
</div>
</div>
</div>
</footer>
<!-- script references -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/myscripts.min.js"></script>
</body>
</html>
asked 2 mins ago
Bootstrap 3 Modal isn't working with the theme
Aucun commentaire:
Enregistrer un commentaire