【问题标题】:Anchor tag within a bootstrap 3 collapse引导程序中的锚标记 3 折叠
【发布时间】:2015-07-31 02:29:13
【问题描述】:

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

这是我的代码的 sn-p 和我的小提琴 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 -->

【问题讨论】:

    标签: javascript jquery html twitter-bootstrap


    【解决方案1】:

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

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

    【讨论】:

      猜你喜欢
      • 2016-06-08
      • 1970-01-01
      • 1970-01-01
      • 2013-03-10
      • 2021-09-13
      • 1970-01-01
      • 1970-01-01
      • 2020-10-25
      • 2021-08-21
      相关资源
      最近更新 更多