2017-04-27 60 views
0

这是一个非常令人费解的问题,但是我在下面的模式下的所有链接都不起作用(单击链接,没有任何反应)。我只是想让它打开href到正确的页面。任何帮助,将不胜感激。代码如下:Modal中的链接不适用于引导程序

信息

     <!-- Modal --> 
         <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> 
          <div class="modal-dialog" role="document"> 
          <div class="modal-content"> 
           <div class="modal-header"> 
           <h5 class="modal-title" id="exampleModalLabel">US Citizenship Quiz</h5> 
           <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
            <span aria-hidden="true">&times;</span> 
           </button> 
           </div> 
           <div class="modal-body"> 
           Small sampling of the US Citizenship Test built with HTML, CSS, and JavaScript. 
           </div> 
           <div class="modal-footer"> 
             <a href="https://bgalladian.github.io/project-01" class="btn btn-default" role="button">Go to Site</a> 
             <a href="https://github.com/bgalladian/project-01" class="btn btn-default" role="button">Go to Code</a> 
           <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> 
           </div> 
          </div> 
          </div> 
         </div> 
         <!-- End of Modal --> 

编辑:添加整个代码

<!doctype html> 
 
<html> 
 
<head lang="en"> 
 
\t <meta charset="utf-8"> 
 
\t <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> 
 

 
\t <title>Bedig Galladian</title> 
 

 
\t <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> 
 
\t <link rel="stylesheet" href="fancybox/jquery.fancybox-v=2.1.5.css" type="text/css" media="screen"> 
 
    <link rel="stylesheet" href="css/font-awesome.min.css" rel="stylesheet"> 
 
\t \t <link href="css/ihover.css" rel="stylesheet"> 
 

 

 
\t <link rel="stylesheet" type="text/css" href="css/style.css"> 
 

 
\t <link href='http://fonts.googleapis.com/css?family=Titillium+Web:400,600,300,200&subset=latin,latin-ext' rel='stylesheet' type='text/css'> 
 

 

 
\t <link rel="prefetch" href="images/zoom.png"> 
 

 
</head> 
 

 
<body> 
 
\t <div class="navbar navbar-fixed-top" data-activeslide="1"> 
 
\t \t <div class="container"> 
 

 
\t \t \t <!-- .navbar-toggle is used as the toggle for collapsed navbar content --> 
 
\t \t \t <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse"> 
 
\t \t \t \t <span class="icon-bar"></span> 
 
\t \t \t \t <span class="icon-bar"></span> 
 
\t \t \t \t <span class="icon-bar"></span> 
 
\t \t \t </button> 
 

 

 
\t \t \t <div class="nav-collapse collapse navbar-responsive-collapse"> 
 
\t \t \t \t <ul class="nav row"> 
 
\t \t \t \t \t <li data-slide="1" class="col-12 col-sm-2"><a id="menu-link-1" href="#slide-1" title="Next Section"><span class="icon icon-home"></span> <span class="text">HOME</span></a></li> 
 
\t \t \t \t \t <li data-slide="2" class="col-12 col-sm-2"><a id="menu-link-2" href="#slide-2" title="Next Section"><span class="icon icon-user"></span> <span class="text">ABOUT ME</span></a></li> 
 
\t \t \t \t \t <li data-slide="7" class="col-12 col-sm-2"><a id="menu-link-7" href="#slide-7" title="Next Section"><span class="icon icon-briefcase"></span> <span class="text">PORTFOLIO</span></a></li> 
 
\t \t \t \t \t <li data-slide="4" class="col-12 col-sm-2"><a id="menu-link-4" href="#slide-4" title="Next Section"><span class="icon icon-gears"></span> <span class="text">SKILLS</span></a></li> 
 
\t \t \t \t \t <li data-slide="5" class="col-12 col-sm-2"><a id="menu-link-5" href="#slide-5" title="Next Section"><span class="icon icon-file"></span> <span class="text">RESUME</span></a></li> 
 
\t \t \t \t \t <li data-slide="6" class="col-12 col-sm-2"><a id="menu-link-6" href="#slide-6" title="Next Section"><span class="icon icon-envelope"></span> <span class="text">CONTACT</span></a></li> 
 
\t \t \t \t </ul> 
 
\t \t \t \t <div class="row"> 
 
\t \t \t \t \t <div class="col-sm-2 active-menu"></div> 
 
\t \t \t \t </div> 
 
\t \t \t </div><!-- /.nav-collapse --> 
 
\t \t </div><!-- /.container --> 
 
\t </div><!-- /.navbar --> 
 

 

 
\t <!-- === Arrows === --> 
 
\t <div id="arrows"> 
 
\t \t <div id="arrow-up" class="disabled"></div> 
 
\t \t <div id="arrow-down"></div> 
 
\t \t <div id="arrow-left" class="disabled visible-lg"></div> 
 
\t \t <div id="arrow-right" class="disabled visible-lg"></div> 
 
\t </div><!-- /.arrows --> 
 

 

 
\t <!-- === MAIN Background === --> 
 
\t <div class="slide story" id="slide-1" data-slide="1"> 
 
\t \t <div class="container"> 
 
\t \t \t <div id="home-row-1" class="row clearfix"> 
 
\t \t \t \t <div class="col-12"> 
 
\t \t \t \t \t <h1 class="font-semibold">Bedig <span class="font-thin">Galladian</span></h1> 
 
\t \t \t \t \t <h4 class="font-thin">I am a <span class="font-semibold">Full Stack Web Developer</span></h4> 
 
\t \t \t \t \t <br> 
 
\t \t \t \t \t <br> 
 
\t \t \t \t </div><!-- /col-12 --> 
 
\t \t \t </div><!-- /row --> 
 
\t \t \t <div id="home-row-2" class="row clearfix"> 
 
\t \t \t \t <div class="col-12 col-sm-6"><span>PROFESSIONAL</span></div> 
 
\t \t \t \t <div class="col-12 col-sm-6"><span>PERSONABLE</span></div> 
 
\t \t \t \t <!-- <div class="col-12 col-sm-4"><span>SUITABLE</span></div> --> 
 
\t \t \t </div><!-- /row --> 
 
\t \t </div><!-- /container --> 
 
\t </div><!-- /slide1 --> 
 

 
\t <!-- === Slide 2 === --> 
 
\t <div class="slide story" id="slide-2" data-slide="2"> 
 
\t \t <div class="container"> 
 
\t \t \t <div class="row title-row"> 
 
\t \t \t \t <div class="col-12 font-thin">About <span class="font-semibold">Me</span></div> 
 
\t \t \t </div><!-- /row --> 
 
\t \t \t <div class="row line-row"> 
 
\t \t \t \t <div class="hr">&nbsp;</div> 
 
\t \t \t </div><!-- /row --> 
 
\t \t \t <div class="row subtitle-row"> 
 
\t \t \t \t <div class="col-12 font-thin">Knower of <span class="font-semibold">useless facts</span></div> 
 
\t \t \t </div><!-- /row --> 
 
\t \t \t <div class="row content-row"> 
 
\t \t \t \t <div class="col-12 col-lg-4 col-sm-6"> 
 
\t \t \t \t \t <p><i class="icon-book"></i></p> 
 
\t \t \t \t \t <h2 class="font-thin">How I Was <span class="font-semibold">Educated</span></h2> 
 
\t \t \t \t \t <h4 class="font-thin">I graduated from Towson University in 2012 with my Masters in Student Affairs and Higher Education Administration. After many years of advising students, I decided to that one of my hobbies (web development) is something I would like to pursue. Hence why enrolled in General Assemblys Web Immersive Program! </h4> 
 
\t \t \t \t </div><!-- /col12 --> 
 
\t \t \t \t <div class="col-12 col-lg-4 col-sm-6"> 
 
\t \t \t \t \t <p><i class="icon icon-laptop"></i></p> 
 
\t \t \t \t \t <h2 class="font-thin">My Personal <span class="font-semibold">Skills</span></h2> 
 
\t \t \t \t \t <h4 class="font-thin">As a former Student Affairs professional, I have leadership and collaboration skills as well as creativity. I also possess strong interpersonal and social communication skills and can interact with supervisors, coworkers, and clients alike to achieve a desired product. I have a strong detail focus, and can work well under pressure. 
 
</h4> 
 
\t \t \t \t </div><!-- /col12 --> 
 
\t \t \t \t <div class="col-12 col-lg-4 col-sm-6"> 
 
\t \t \t \t \t <p><i class="icon icon-smile"></i></p> 
 
\t \t \t \t \t <h2 class="font-thin">What I Do For <span class="font-semibold">Fun</span></h2> 
 
\t \t \t \t \t <h4 class="font-thin">I love to learn and be creative, which is what web development has done for me. Other than coding, I love to research various historical events, and watch movies constantly. Netflix is always on in my home. I hope to write sreenplay one day. My perfect day is a set of Legos to build with and a good movie on the TV. Avid sneakerhead.</h4> 
 
\t \t \t \t </div><!-- /col12 --> 
 

 
\t \t \t </div><!-- /row --> 
 
\t \t </div><!-- /container --> 
 
\t </div><!-- /slide2 --> 
 

 
\t <!-- === SLide 3 - Portfolio --> 
 
\t \t <div class="slide story" id="slide-7" data-slide="7"> 
 
\t \t \t <div class="row align-items-"> 
 

 
\t \t \t \t <div class="container-fluid"> 
 
\t \t \t \t \t <div class="row title-row"> 
 
\t \t \t \t \t \t <div class="col-12 font-thin">My <span class="font-semibold">Portfolio</span></div> 
 
\t \t \t \t \t </div><!-- /row --> 
 
\t \t \t \t \t <div class="row line-row"> 
 
\t \t \t \t \t \t <div class="hr">&nbsp;</div> 
 
\t \t \t \t \t </div><!-- /row --> 
 
\t \t \t \t \t <div class="row subtitle-row"> 
 
\t \t \t \t \t \t <div class="col-12 font-thin">Take a look at some of my work</span></div> 
 
\t \t \t \t \t </div><!-- /row --> 
 

 
\t \t \t \t \t <div class="row content-row"> 
 

 
\t \t \t \t \t \t <div class="col-12 col-lg-3 col-sm-"> 
 
\t \t \t \t \t \t \t <a href="http://www.bgallad.com/project-01/"><img src="images/ucq.png"></a> 
 
\t \t \t \t \t \t \t <h2 class="font-thin"><span class="font-semibold">US Citzenship Quiz</span></h2> 
 

 
\t \t \t \t \t \t <!-- Modal Button --> 
 
\t \t \t \t \t \t \t <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal"> 
 
\t \t \t \t \t \t \t Information 
 
\t \t \t \t \t \t \t </button> 
 

 
\t \t \t \t \t \t \t <!-- Modal --> 
 
\t \t \t \t \t \t \t <div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> 
 
\t \t \t \t \t \t \t <div class="modal-dialog" role="document"> 
 
\t \t \t \t \t \t \t  <div class="modal-content"> 
 
\t \t \t \t \t \t \t  <div class="modal-header"> 
 
\t \t \t \t \t \t \t   <h5 class="modal-title" id="exampleModalLabel">US Citizenship Quiz</h5> 
 
\t \t \t \t \t \t \t   <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
 
\t \t \t \t \t \t \t   <span aria-hidden="true">&times;</span> 
 
\t \t \t \t \t \t \t   </button> 
 
\t \t \t \t \t \t \t  </div> 
 
\t \t \t \t \t \t \t  <div class="modal-body"> 
 
\t \t \t \t \t \t \t   Small sampling of the US Citizenship Test built with HTML, CSS, and JavaScript. 
 
\t \t \t \t \t \t \t  </div> 
 
\t \t \t \t \t \t \t  <div class="modal-footer"> 
 
\t \t \t \t \t \t \t \t \t \t \t <a href="https://bgalladian.github.io/project-01" class="btn btn-default" role="button" target="blank">Go to Site</a> 
 
\t \t \t \t \t \t \t \t \t \t \t <a href="https://github.com/bgalladian/project-01" class="btn btn-default" role="button">Go to Code</a> 
 
\t \t \t \t \t \t \t   <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> 
 
\t \t \t \t \t \t \t  </div> 
 
\t \t \t \t \t \t \t  </div> 
 
\t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t <!-- End of Modal --> 
 

 
\t \t \t \t \t \t </div><!-- /col12 --> 
 

 
\t \t \t \t \t \t <div class="col-12 col-lg-3 col-sm-6"> 
 
\t \t \t \t \t \t \t <a href="http://wasitworthit.herokuapp.com"><img src="images/wasitworthit.png"></a> 
 
\t \t \t \t \t \t \t <h2 class="font-thin"><span class="font-semibold">Was It It Worth It?</span></h2> 
 

 
\t \t \t \t \t \t \t <!-- Modal Button --> 
 
\t \t \t \t \t \t \t \t <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal1"> 
 
\t \t \t \t \t \t \t \t Information 
 
\t \t \t \t \t \t \t \t </button> 
 

 
\t \t \t \t \t \t \t \t <!-- Modal --> 
 
\t \t \t \t \t \t \t \t <div class="modal fade" id="exampleModal1" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> 
 
\t \t \t \t \t \t \t \t <div class="modal-dialog" role="document"> 
 
\t \t \t \t \t \t \t \t  <div class="modal-content"> 
 
\t \t \t \t \t \t \t \t  <div class="modal-header"> 
 
\t \t \t \t \t \t \t \t   <h5 class="modal-title" id="exampleModalLabel">Was It Worth It?</h5> 
 
\t \t \t \t \t \t \t \t   <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
 
\t \t \t \t \t \t \t \t   <span aria-hidden="true">&times;</span> 
 
\t \t \t \t \t \t \t \t   </button> 
 
\t \t \t \t \t \t \t \t  </div> 
 
\t \t \t \t \t \t \t \t  <div class="modal-body"> 
 
\t \t \t \t \t \t \t \t \t \t \t \t A movie review app with a "unique" ranking system. Built with Ruby on Rails, with 3 models, a seach function, and user authentication. Built over the course of 3 days. 
 

 
\t \t \t \t \t \t \t \t  </div> 
 
\t \t \t \t \t \t \t \t  <div class="modal-footer"> 
 
\t \t \t \t \t \t \t \t \t \t \t \t <a href="https://wasitworthit.herokuapp.com/" class="btn btn-default" role="button">Go to Site</a> 
 
\t \t \t \t \t \t \t \t \t \t \t \t <a href="https://github.com/bgalladian/project-02" class="btn btn-default" role="button">Go to Code</a> 
 
\t \t \t \t \t \t \t \t   <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> 
 
\t \t \t \t \t \t \t \t  </div> 
 
\t \t \t \t \t \t \t \t  </div> 
 
\t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t \t <!-- End of Modal --> 
 

 
\t \t \t \t \t \t </div><!-- /col12 --> 
 

 
\t \t \t \t \t \t <div class="col-12 col-lg-3 col-sm-6"> 
 
\t \t \t \t \t \t \t <a href="https://sdkclements.github.io/oneShotFront/"><img src="images/oneShot.png"></a> 
 
\t \t \t \t \t \t \t <h2 class="font-thin"><span class="font-semibold">oneShot</span></h2> 
 

 
\t \t \t \t \t \t \t \t <!-- Modal Button --> 
 
\t \t \t \t \t \t \t \t \t <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal2"> 
 
\t \t \t \t \t \t \t \t \t \t Information 
 
\t \t \t \t \t \t \t \t \t </button> 
 

 
\t \t \t \t \t \t \t \t \t <!-- Modal --> 
 
\t \t \t \t \t \t \t \t \t <div class="modal fade" id="exampleModal2" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> 
 
\t \t \t \t \t \t \t \t \t \t <div class="modal-dialog" role="document"> 
 
\t \t \t \t \t \t \t \t \t \t \t <div class="modal-content"> 
 
\t \t \t \t \t \t \t \t \t \t \t \t <div class="modal-header"> 
 
\t \t \t \t \t \t \t \t \t \t \t \t \t <h5 class="modal-title" id="exampleModalLabel">oneShot</h5> 
 
\t \t \t \t \t \t \t \t \t \t \t \t \t <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
 
\t \t \t \t \t \t \t \t \t \t \t \t \t \t <span aria-hidden="true">&times;</span> 
 
\t \t \t \t \t \t \t \t \t \t \t \t \t </button> 
 
\t \t \t \t \t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t \t \t \t \t \t <div class="modal-body"> 
 
\t \t \t \t \t \t \t \t \t \t \t \t \t My first project with a team. Built with a Rails backend with an Angular frontend. It is an anonymous message board with no delete or edit function. Hence the user only gets "one shot". 
 

 
\t \t \t \t \t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t \t \t \t \t \t <div class="modal-footer"> 
 
\t \t \t \t \t \t \t \t \t \t \t \t \t <a href="https://sdkclements.github.io/oneShotFront/" class="btn btn-default" role="button">Go to Site</a> 
 
\t \t \t \t \t \t \t \t \t \t \t \t \t <a href="https://github.com/sdkclements/oneShotFront" class="btn btn-default" role="button">Go to Code</a> 
 
\t \t \t \t \t \t \t \t \t \t \t \t \t <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> 
 
\t \t \t \t \t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t \t \t <!-- End of Modal --> 
 

 
\t \t \t \t \t \t </div><!-- /col12 --> 
 

 
\t \t \t \t \t \t <div class="col-12 col-lg-3 col-sm-6"> 
 
\t \t \t \t \t \t \t <p><img src="images/kicksstarter.png"></p> 
 
\t \t \t \t \t \t \t <h2 class="font-thin"><span class="font-semibold">kickSStarter</span></h2> 
 

 
\t \t \t \t \t \t \t <!-- Modal Button --> 
 
\t \t \t \t \t \t \t \t <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal3"> 
 
\t \t \t \t \t \t \t \t \t Information 
 
\t \t \t \t \t \t \t \t </button> 
 

 
\t \t \t \t \t \t \t \t <!-- Modal --> 
 
\t \t \t \t \t \t \t \t <div class="modal fade" id="exampleModal3" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> 
 
\t \t \t \t \t \t \t \t \t <div class="modal-dialog" role="document"> 
 
\t \t \t \t \t \t \t \t \t \t <div class="modal-content"> 
 
\t \t \t \t \t \t \t \t \t \t \t <div class="modal-header"> 
 
\t \t \t \t \t \t \t \t \t \t \t \t <h5 class="modal-title" id="exampleModalLabel">kickSStarter</h5> 
 
\t \t \t \t \t \t \t \t \t \t \t \t <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
 
\t \t \t \t \t \t \t \t \t \t \t \t \t <span aria-hidden="true">&times;</span> 
 
\t \t \t \t \t \t \t \t \t \t \t \t </button> 
 
\t \t \t \t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t \t \t \t \t <div class="modal-body"> 
 
\t \t \t \t \t \t \t \t \t \t \t \t A website where independent sneaker designers can submit custom designs to showcase their talents to other designers. Built with Mongo, Express, ReactJS, and NodeJS. 
 

 
\t \t \t \t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t \t \t \t \t <div class="modal-footer"> 
 
\t \t \t \t \t \t \t \t \t \t \t \t <a thref="https://github.com/bgalladian/kickSStarter2" class="btn btn-default" role="button">Go to Code</a> 
 
\t \t \t \t \t \t \t \t \t \t \t \t <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> 
 
\t \t \t \t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t \t <!-- End of Modal --> 
 

 
\t \t \t \t \t \t </div><!-- /col12 --> 
 
\t \t \t \t \t </div><!-- /row --> 
 
\t \t \t \t </div><!-- /container --> 
 

 
\t \t \t </div><!-- /row --> 
 
\t \t </div><!-- /slide3 --> 
 

 

 
\t <!-- === Slide 4 - Skills === --> 
 
\t <div class="slide story" id="slide-4" data-slide="4"> 
 
\t \t <div class="container"> 
 
\t \t \t <div class="row title-row"> 
 
\t \t \t \t <div class="col-12 font-thin">See what <span class="font-semibold">I can do</span></div> 
 
\t \t \t </div><!-- /row --> 
 
\t \t \t <div class="row line-row"> 
 
\t \t \t \t <div class="hr">&nbsp;</div> 
 
\t \t \t </div><!-- /row --> 
 
\t \t \t <div class="row subtitle-row"> 
 
\t \t \t \t <div class="col-sm-1 hidden-sm">&nbsp;</div> 
 
\t \t \t \t <div class="col-12 col-sm-10 font-light">Most important skill is being able to learn <span class="font-semibold">Fast</span></div> 
 
\t \t \t \t <div class="col-sm-1 hidden-sm">&nbsp;</div> 
 
\t \t \t </div><!-- /row --> 
 

 

 
\t \t \t <div class="row content-row"> 
 
\t \t \t \t <div class="col-sm-1 hidden-sm">&nbsp;</div> 
 
\t \t \t \t <div class="col-12 col-sm-4"> 
 
\t \t \t \t \t <h2 class="font-thin"><br><span class="font-semibold" >Front End</span></h2> 
 
\t \t \t \t \t <h4 class="font-thin"> 
 
\t \t \t \t \t \t <p>HTML</p> 
 
\t \t \t \t \t \t <p>CSS</p> 
 
\t \t \t \t \t \t <p>JavaScript</p> 
 
\t \t \t \t \t \t <p>jQuery</p> 
 
\t \t \t \t \t \t <p>AngularJS</p> 
 
\t \t \t \t \t \t <p>React</p> 
 
\t \t \t \t \t \t <p>Bootstrap</p> 
 
\t \t \t \t \t \t <p>Materialize</p> 
 
\t \t \t \t </div><!-- /col12 --> 
 
\t \t \t \t <div class="col-12 col-sm-3"> 
 
\t \t \t \t \t <h2 class="font-thin"><br><span class="font-semibold" >Back End</span></h2> 
 
\t \t \t \t \t <h4 class="font-thin"> 
 
\t \t \t \t \t \t <p>Ruby</p> 
 
\t \t \t \t \t \t <p>Rails</p> 
 
\t \t \t \t \t \t <p>Mongoose</p> 
 
\t \t \t \t \t \t <p>Sinatra</p> 
 
\t \t \t \t \t \t <p>NodeJS</p> 
 
\t \t \t \t \t \t <p>Express</p> 
 
\t \t \t \t \t \t <p>PostGresQL</p> 
 

 
\t \t \t \t \t </h4> 
 
\t \t \t \t </div> 
 
\t \t \t \t <div class="col-12 col-sm-3"> 
 
\t \t \t \t \t <h2 class="font-thin"><br><span class="font-semibold">Other</span></h2> 
 
\t \t \t \t \t <h4 class="font-thin"> 
 
\t \t \t \t \t \t <p>GitHub</p> 
 
\t \t \t \t \t \t <p>Heroku</p> 
 
\t \t \t \t \t \t <p>Windows</p> 
 
\t \t \t \t \t \t <p>MacOS</p> 
 
\t \t \t \t \t \t <p>Microsoft Office Suite</p> 
 
\t \t \t \t \t \t <p>Google Docs</p> 
 
\t \t \t \t \t \t <p>User Stories</p> 
 
\t \t \t \t \t \t <p>Wire Framing</p> 
 

 
\t \t \t \t \t </h4> 
 
\t \t \t \t </div> 
 
\t \t \t \t <div class="col-12 col-sm-5"> 
 

 

 
\t \t \t \t <div class="col-sm-1 hidden-sm">&nbsp;</div> 
 
\t \t \t </div><!-- /row --> 
 
\t \t </div><!-- /container --> 
 
\t </div><!-- /slide4 --> 
 

 

 
\t <!-- === Slide 5 === --> 
 
\t <div class="slide story" id="slide-5" data-slide="5"> 
 
\t \t <div class="container"> 
 
\t \t \t <div class="row title-row"> 
 
\t \t \t \t <div class="col-12 font-thin">Take a look at my <span class="font-semibold">Resume</span></div> 
 
\t \t \t </div><!-- /row --> 
 
\t \t \t <div class="row line-row"> 
 
\t \t \t \t <div class="hr">&nbsp;</div> 
 
\t \t \t </div><!-- /row --> 
 
\t \t \t <div class="row subtitle-row"> 
 
\t \t \t \t <div class="col-sm-1 hidden-sm">&nbsp;</div> 
 
\t \t \t \t <div class="col-12 col-sm-10 font-light"> 
 
\t \t \t \t \t <embed src="images/resume.pdf" width="100%" height="1000px"></embed> 
 

 
\t \t \t \t </div> 
 
\t \t \t \t <div class="col-sm-1 hidden-sm">&nbsp;</div> 
 
\t \t \t </div><!-- /row --> 
 

 
\t \t </div><!-- /container --> 
 
\t </div><!-- /slide5 --> 
 

 

 

 
\t <!-- === Slide 6/Contact === --> 
 
\t <div class="slide story" id="slide-6" data-slide="6"> 
 
\t \t <div class="container"> 
 
\t \t \t <div class="row title-row"> 
 
\t \t \t \t <div class="col-12 font-light">Leave me a <span class="font-semibold">message</span></div> 
 
\t \t \t </div><!-- /row --> 
 
\t \t \t <div class="row line-row"> 
 
\t \t \t \t <div class="hr">&nbsp;</div> 
 
\t \t \t </div><!-- /row --> 
 
\t \t \t <div class="row subtitle-row"> 
 
\t \t \t \t <div class="col-sm-1 hidden-sm">&nbsp;</div> 
 
\t \t \t \t <div class="col-12 col-sm-10 font-light">You can find me anywhere, just push a button and I'm there</div> 
 
\t \t \t \t <div class="col-sm-1 hidden-sm">&nbsp;</div> 
 
\t \t \t </div><!-- /row --> 
 
\t \t \t <div id="contact-row-4" class="row"> 
 
\t \t \t \t <div class="col-sm-1 hidden-sm">&nbsp;</div> 
 
\t \t \t \t <div class="col-12 col-sm-2 with-hover-text"> 
 
\t \t \t \t \t <p><a target="_blank" href="#"><i class="icon icon-phone"></i></a></p> 
 
\t \t \t \t \t <span class="hover-text font-light ">(240)-200-2418</span></a> 
 
\t \t \t \t </div><!-- /col12 --> 
 
\t \t \t \t <div class="col-12 col-sm-2 with-hover-text"> 
 
\t \t \t \t \t <p><a target="_blank" href="mailto:[email protected]"><i class="icon icon-envelope"></i></a></p> 
 
\t \t \t \t \t <span class="hover-text font-light ">Feel free to email me!</span></a> 
 
\t \t \t \t </div><!-- /col12 --> 
 
\t \t \t \t <div class="col-12 col-sm-2 with-hover-text"> 
 
\t \t \t \t \t <p><i class="icon icon-home"></i></p> 
 
\t \t \t \t \t <span class="hover-text font-light ">Washington, DC</span></a> 
 
\t \t \t \t </div><!-- /col12 --> 
 
\t \t \t \t <div class="col-12 col-sm-2 with-hover-text"> 
 
\t \t \t \t \t <p><a target="_blank" href="https://www.linkedin.com/in/bgalladian/"><i class="icon icon-linkedin"></i></a></p> 
 
\t \t \t \t \t <span class="hover-text font-light ">Lets Connect on LinkedIn!</span></a> 
 
\t \t \t \t </div><!-- /col12 --> 
 
\t \t \t \t <div class="col-12 col-sm-2 with-hover-text"> 
 
\t \t \t \t \t <p><a target="_blank" href="http://www.github.com/bgalladian"><i class="icon icon-github"></i></a></p> 
 
\t \t \t \t \t <span class="hover-text font-light ">Check out my work on Github!</span></a> 
 
\t \t \t \t </div><!-- /col12 --> 
 
\t \t \t \t <div class="col-sm-1 hidden-sm">&nbsp;</div> 
 
\t \t \t </div><!-- /row --> 
 
\t \t </div><!-- /container --> 
 
\t </div><!-- /Slide 6 --> 
 

 
</body> 
 

 
<footer> 
 
\t &copy; Bedig Galladian 2017 
 
</footer> 
 

 
\t <!-- SCRIPTS --> 
 
\t <script src="js/html5shiv.js"></script> 
 
\t <script src="js/jquery-1.10.2.min.js"></script> 
 
\t <script src="js/jquery-migrate-1.2.1.min.js"></script> 
 
\t <script src="js/bootstrap.min.js"></script> 
 
\t <script src="js/jquery.easing.1.3.js"></script> 
 
\t <script type="text/javascript" src="fancybox/jquery.fancybox.pack-v=2.1.5.js"></script> 
 
\t <script src="js/script.js"></script> 
 

 
\t <!-- fancybox init --> 
 
<script> 
 
$(document).ready(function(e) { 
 
\t var lis = $('.nav > li'); 
 
\t menu_focus(lis[0], 1); 
 

 
\t $(".fancybox").fancybox({ 
 
\t \t padding: 10, 
 
\t \t helpers: { 
 
\t \t \t overlay: { 
 
\t \t \t \t locked: false 
 
\t \t \t } 
 
\t \t } 
 
\t }); 
 

 
}); 
 
</script> 
 

 
</html>

+0

你可以给我完整的代码? –

+0

我刚刚为你添加了它。 – SokrateeS

+0

modal是否打开? –

回答

0

添加以下代码:

<asp:UpdatePanel runat="server" > 
    <ContentTemplate> 
      ... your code here ... 
    </ContentTemplate> 
</asp:UpdatePanel> 

<div class="modal fade" ... 

而包装

<div class="modal-dialog" role="document"> 

结果:

<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> 
 
<asp:UpdatePanel runat="server" > 
 
    <ContentTemplate> 
 
         <div class="modal-dialog" role="document"> 
 
         <div class="modal-content"> 
 
          <div class="modal-header"> 
 
          <h5 class="modal-title" id="exampleModalLabel">US Citizenship Quiz</h5> 
 
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"> 
 
           <span aria-hidden="true">&times;</span> 
 
          </button> 
 
          </div> 
 
          <div class="modal-body"> 
 
          Small sampling of the US Citizenship Test built with HTML, CSS, and JavaScript. 
 
          </div> 
 
          <div class="modal-footer"> 
 
            <a href="https://bgalladian.github.io/project-01" class="btn btn-default" role="button">Go to Site</a> 
 
            <a href="https://github.com/bgalladian/project-01" class="btn btn-default" role="button">Go to Code</a> 
 
          <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button> 
 
          </div> 
 
         </div> 
 
         </div> 
 
    </ContentTemplate> 
 
</asp:UpdatePanel> 
 
</div>

+0

没有工作,只是使第二个模式不能打开,链接仍然不工作在模式。 – SokrateeS

+0

什么关于包装整个事情在一个ASP:面板runat =“服务器” –

+0

Naw,没有工作。 – SokrateeS

相关问题