引导程序3中的锚标记崩溃

时间:2015-07-31 02:29:13

标签: javascript jquery html twitter-bootstrap

我正在使用bootstrap构建一个论坛3.当你点击论坛副标题时,它会展开并显示内容。我希望它转到内容中的锚标签。我尝试使用name和#idhere,但它不起作用。

以下是我的代码片段和我的小提琴https://jsfiddle.net/mattmega4/e6armed5/embedded/result/

......还有更多代码

  <a href="#theFirstPost"><h4 class="theBigCollapse" data-
toggle="collapse"><a href="#theFirstPost">Get your work critiqued</a>
<br><small>stuff ere</small></h4></a>
            </td>
            <td class="text-center hidden-xs hidden-sm"><a 
href="#">0</a></td>
            <td class="text-center hidden-xs hidden-sm"><a 
href="#">0</a></td>
            <td class="hidden-xs hidden-sm">by <a href="#">John Doe</a>
<br><small><i class="fa fa-clock-o"></i> Never</small></td>
          </tr>
        </tbody>

<div class="col-md-8" name="theFirstPost">
        <a name="theFirstPost"></a>
        <div id="theFirstPost" name="theFirstPost">
          <div class="firstPost">
          <div class="postHeading">
            <h3>My shot, Banff Pano</h3>
          </div>

          <div class="postBody">
            <p>
            Here is a shot of Banff Alberta, Canada.
            I took a series of photographs in the portrait orientation 
and, using Lightroom and Photoshop, I stitched them together and 
adjusted the image to bring out more contrast and colors. The settings 
are f/11 at 1/500s; ISO 280.
          </p>
          <p>
            I'm wondering if I should have used a wider aperture and 
let the background be a little more blurred
          </p>
          </div>
          <div class="postImage">
            <img src="assets/pano.jpg" />
          </div>
          <div class="postFooter">
            <p>
              Posted on 7/23/15 at 12:05PM
            </p>
          </div>
        </div>
      </div>


</div> <!-- end of 8 -->

1 个答案:

答案 0 :(得分:0)

我的老师解决了我的问题,而不是使用HTML我们使用jquery来解决它

$('html, body').animate({
    scrollTop: $("#theFirstPost").offset().top
}, 1000)