我遇到了spyscroll的问题,它不会在导航中显示活动链接。我按照bootstrap 4文档进行操作,但仍然无效。
这是我的身体标签:
<body data-spy="scroll" data-target="#navBarNav" data-offset="70">
我甚至相对于身体标签添加了。
我的导航标记:
<nav class="navbar sticky-top navbar-expand-md navbar-dark bg-dark">
<a class="navbar-brand" href="#">Daniel Saavedra</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navBarNav" aria-controls="navBarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navBarNav">
<ul class="navbar-nav mr-auto">
<li class="nav-item">
<a class="nav-link active" href="#home">Home <span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="#about">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#portfolio">Portfolio</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contact">Contact</a>
</li>
</ul>
</div>
</nav>
答案 0 :(得分:-1)
检查此工作代码段是否为scrollspy
<body data-offset="50" data-target="#side-nav" data-spy="scroll">
<div class="container">
<div class="row">
<div class="span3" id="side-nav">
<ul class="nav nav-list about-list hidden-phone hidden-tablet affix" >
<li class="active"><a href="#about"><i class="icon-chevron-right"></i> About Me</a></li>
<li><a href="#education"><i class="icon-chevron-right"></i> Education</a></li>
<li><a href="#work"><i class="icon-chevron-right"></i> Work Experience</a></li>
<li ><a href="#sports"><i class="icon-chevron-right"></i> Sports</a></li>
</ul>
</div>
<div class="span6 hidden-phone">
<div class="page-header" id="about">
<h1 >About Me</h1>
<p>My name is Matt Altepeter. I am 21 years old and currently in my third year at Purdue University in Lafayette, Indiana. I am an aspiring web developer and software engineer. My dream job would be to work for Apple, inc. as a software engineer specializing in the software that runs on iPhones, iPads, and iPod Touches (iOS). You can use the menu below to navigate through the rest of information, or the menu at the top of the page. You can find my contact info at the bottom of this page or on the contact page.</p>
</div>
<div id="education" class="page-header">
<h1 >Education</h1>
<p>I graduated from Jefferson High School of Lafayette, Indiana in 2010. Excluding the required course, I took mostly Project Lead the Way courses which aim to prepare students for engineering at the college level. I opted to take several advanced placement and honors courses as well. I began my college career at Purdue University in West Lafayette, Indiana in the fall of 2010. I originally started studying aerospace engineering, but made up my mind to switch to computer sciences in the spring of 2011. I made this decision because I found myself doing a lot of programming in my spare time.</p><br>
<p>Since making the change to computer sciences, I have found myself enjoying college more. It is important to find something that you enjoy doing so you will enjoy your career.</p>
</div>
<div id="work" class="page-header">
<h1 >Work Experience</h1>
<p>
</p><h4>ESPN</h4>
<p class="cust-lead">On February 28th I found out that I was selected for an internship at ESPN in Bristol, CT for the summer of 2013. I am looking forward to this experience because it is the perfect combination of computers and sports. I will be working on various features of the ESPN website.</p>
<h4>Purdue Center For Career Opportunities (current)</h4>
<p class="cust-lead">I was hired at Purdue CCO in December of 2012 as a web developer. My job description includes slimming down the files and deleting unnecessary files/code, making the various pages look good throughout all browsers, fixing accessibility issues so the site is better for users with disabilities, and creating new content. I am planning to take on my first big project soon which will be a mobile site.</p>
<h4>Freelance Computing</h4>
<p class="cust-lead">I have done some freelance work in my spare time. This has consisted of developing a few websites, check out my portfolio for more on that. I have also done computer maintenance for several clients. I am also very knowledgable in setting up home theater systems, iPhones, iPads and pretty much any other piece of technology.</p>
<h4>Steiner Enterprises, Inc.</h4>
<p class="cust-lead">I was hired there on May 16 to begin rewriting all of their websites. The first site I began rewriting was
Next Generation Science. My main goal for this site was to create a user-friendly, modern online store.</p>
<h4>Drywall and Woodwork Restoration</h4>
<p class="cust-lead">In the summer of 2010, three weeks before I was going to start at Purdue, I was approached by local contractor Ryan Rathburn to assist him in restoring the drywall and woodwork in several apartments that had flooded. This job was temporary?only lasting until the semester started.</p>
<h4>Nuclear Engineering Research Internship</h4>
<p class="cust-lead">The summer before my senior year of high school, I spent a month and a half conducting research at a Purdue University nuclear engineering research lab. The research was being done for the Purdue science fair, in which I received a first place prize in chemistry. The research topic was neutron detection. My final research paper can be read here.</p>
<h4>Indiana Spaceport STS-125 Mission Specialist</h4>
<p class="cust-lead-last">In the spring of 2009 I was selected as the commander of the Indiana Spaceport STS-125 shadow program. The purpose of this was to familiarize students interested in space travel with what a real NASA mission is like. STS-125 was the final servicing mission to the Hubble Space Telescope. There were 7 astronauts on this mission and seven students were chosen?each assigned to follow one of the astronauts. I was assigned to follow Scott Altman, the commander of the mission. As a group, we would travel around Indiana and educate various groups on space travel and the Hubble mission in particular. A few of us also volunteered to help assist the Indiana Space Camp. One of the coolest things we got to do was talk to the astronauts while they were in space. During the Indiana State Fair we were asked to work at the Spaceport booth to help educate visitors about space travel. The last event we did as a whole was to go to the premiere of the IMAX movie: ?Hubble 3D.? A 3D camera had traveled in the payload bay of Atlantis to capture amazing footage of the crew servicing Hubble.</p>
<p></p>
</div>
<div id="sports" class="page-header">
<h1 >Sports</h1>
<p>
Throughout my life, sports have always been a big part of my life. I started out playing t-ball, basketball and running track. I took a break from running track until I picked it back up again in middle school, where I ran the 400m dash and the 4x400m relay. I stuck with basketball up through the end of middle school. I continued to play baseball through my sophomore year of high school, but stopped playing to do better in school. After I stopped playing baseball, I picked up FIRST Robotics, which helped me decide to major in engineering. It also rewarded me with a $10,000 scholarship to Purdue.<br>
I have always been a huge fan of professional sports. I mostly watch professional baseball, football, men?s basketball, and men?s college basketball and football. I enjoy watching sports because it is a nice way to relax, although during the playoffs of any sport I am very tense. My teams are:
</p><ul>
<li style="color: red">The Boston Red Sox</li>
<li style="color: green">The Boston Celtics</li>
<li style="color: blue">The Indianapolis Colts</li>
<li style="color: rgb(240, 85, 35)">The Denver Broncos</li>
<li style="color: #a47700">The Purdue Boilermakers</li>
</ul>
<p></p>
</div>
</div>
<div class="span6 visible-phone">
<div id="accordion2" class="accordion">
<div class="accordion-group">
<div class="accordion-heading">
<a href="#collapseOne" data-parent="#accordion2" data-toggle="collapse" class="accordion-toggle">
About Me
</a>
</div>
<div class="accordion-body collapse in" id="collapseOne">
<div class="accordion-inner">
<p>My name is Matt Altepeter. I am 21 years old and currently in my third year at Purdue University in Lafayette, Indiana. I am an aspiring web developer and software engineer. My dream job would be to work for Apple, inc. as a software engineer specializing in the software that runs on iPhones, iPads, and iPod Touches (iOS). You can use the menu below to navigate through the rest of information, or the menu at the top of the page. You can find my contact info at the bottom of this page or on the contact page.</p>
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a href="#collapseTwo" data-parent="#accordion2" data-toggle="collapse" class="accordion-toggle">
Education
</a>
</div>
<div class="accordion-body collapse" id="collapseTwo">
<div class="accordion-inner">
<p>I graduated from Jefferson High School of Lafayette, Indiana in 2010. Excluding the required course, I took mostly Project Lead the Way courses which aim to prepare students for engineering at the college level. I opted to take several advanced placement and honors courses as well. I began my college career at Purdue University in West Lafayette, Indiana in the fall of 2010. I originally started studying aerospace engineering, but made up my mind to switch to computer sciences in the spring of 2011. I made this decision because I found myself doing a lot of programming in my spare time.<br>
Since making the change to computer sciences, I have found myself enjoying college more. It is important to find something that you enjoy doing so you will enjoy your career.</p>
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a href="#collapseFour" data-parent="#accordion2" data-toggle="collapse" class="accordion-toggle">
Work Experience
</a>
</div>
<div class="accordion-body collapse" id="collapseFour">
<div class="accordion-inner">
<h4>ESPN</h4>
<p class="cust-lead">On February 28th I found out that I was selected for an internship at ESPN in Bristol, CT for the summer of 2013. I am looking forward to this experience because it is the perfect combination of computers and sports. I will be working on various features of the ESPN website.</p>
<h4>Purdue Center For Career Opportunities (current)</h4>
<p class="cust-lead">I was hired at Purdue CCO in December of 2012 as a web developer. My job description includes slimming down the files and deleting unnecessary files/code, making the various pages look good throughout all browsers, fixing accessibility issues so the site is better for users with disabilities, and creating new content. I am planning to take on my first big project soon which will be a mobile site.</p>
<h4>Freelance Computing</h4>
<p class="cust-lead">I have done some freelance work in my spare time. This has consisted of developing a few websites, check out my portfolio for more on that. I have also done computer maintenance for several clients. I am also very knowledgable in setting up home theater systems, iPhones, iPads and pretty much any other piece of technology.</p>
<h4>Steiner Enterprises, Inc.</h4>
<p class="cust-lead">I was hired there on May 16 to begin rewriting all of their websites. The first site I began rewriting was
Next Generation Science. My main goal for this site was to create a user-friendly, modern online store.</p>
<h4>Drywall and Woodwork Restoration</h4>
<p class="cust-lead">In the summer of 2010, three weeks before I was going to start at Purdue, I was approached by local contractor Ryan Rathburn to assist him in restoring the drywall and woodwork in several apartments that had flooded. This job was temporary?only lasting until the semester started.</p>
<h4>Nuclear Engineering Research Internship</h4>
<p class="cust-lead">The summer before my senior year of high school, I spent a month and a half conducting research at a Purdue University nuclear engineering research lab. The research was being done for the Purdue science fair, in which I received a first place prize in chemistry. The research topic was neutron detection. My final research paper can be read here.</p>
<h4>Indiana Spaceport STS-125 Mission Specialist</h4>
<p class="cust-lead-last">In the spring of 2009 I was selected as the commander of the Indiana Spaceport STS-125 shadow program. The purpose of this was to familiarize students interested in space travel with what a real NASA mission is like. STS-125 was the final servicing mission to the Hubble Space Telescope. There were 7 astronauts on this mission and seven students were chosen?each assigned to follow one of the astronauts. I was assigned to follow Scott Altman, the commander of the mission. As a group, we would travel around Indiana and educate various groups on space travel and the Hubble mission in particular. A few of us also volunteered to help assist the Indiana Space Camp. One of the coolest things we got to do was talk to the astronauts while they were in space. During the Indiana State Fair we were asked to work at the Spaceport booth to help educate visitors about space travel. The last event we did as a whole was to go to the premiere of the IMAX movie: ?Hubble 3D.? A 3D camera had traveled in the payload bay of Atlantis to capture amazing footage of the crew servicing Hubble.</p>
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a href="#collapseFive" data-parent="#accordion2" data-toggle="collapse" class="accordion-toggle">
Sports
</a>
</div>
<div class="accordion-body collapse" id="collapseFive">
<div class="accordion-inner">
<p>
Throughout my life, sports have always been a big part of my life. I started out playing t-ball, basketball and running track. I took a break from running track until I picked it back up again in middle school, where I ran the 400m dash and the 4x400m relay. I stuck with basketball up through the end of middle school. I continued to play baseball through my sophomore year of high school, but stopped playing to do better in school. After I stopped playing baseball, I picked up FIRST Robotics, which helped me decide to major in engineering. It also rewarded me with a $10,000 scholarship to Purdue.<br>
I have always been a huge fan of professional sports. I mostly watch professional baseball, football, men?s basketball, and men?s college basketball and football. I enjoy watching sports because it is a nice way to relax, although during the playoffs of any sport I am very tense. My teams are:
</p><ul>
<li style="color: red">The Boston Red Sox</li>
<li style="color: green">The Boston Celtics</li>
<li style="color: blue">The Indianapolis Colts</li>
<li style="color: rgb(240, 85, 35)">The Denver Broncos</li>
<li style="color: #a47700">The Purdue Boilermakers</li>
</ul>
<p></p>
</div>
</div>
</div>
</div>
</div>
<div class="span3 hidden-phone hidden-tablet">
<h1>Twitter Feed</h1>
</div>
</div> <!-- /container -->
</div>