当前位置: 代码迷 >> JavaScript >> 引导3内的锚标记折叠
  详细解决方案

引导3内的锚标记折叠

热度:6   发布时间:2023-06-05 14:17:06.0

我正在使用Bootstrap 3建立一个论坛。当您单击论坛副标题时,它会崩溃并显示内容。 我希望它转到该内容内的定位标记。 我尝试使用name和#idhere,但是它不起作用。

这是我的代码和小提琴的代码片段

...更多顶部代码

  <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 -->

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

$('html, body').animate({
    scrollTop: $("#theFirstPost").offset().top
}, 1000)
  相关解决方案