滚动到顶部的引导模式点击按钮在模态

时间:2021-12-01 10:38:22
<div class="modal-dialog" role="document">
  <div class="modal-content login conatct_main" id="mdlcont">
    <div class="modal-body">
      <div class="row"> 
        <div class="col-md-12">
          <button id="registrsubmit" name="registrsubmit" value="true" class="friends_log pull-right">Register</button>
        </div>  
      </div>
    </div>
  </div>
</div>

The modal is not scrolling to top after a click. I tried scrolltop() method. It is not working . Can anyone help me on this? ![enter image description here][1]

模式不是在点击后滚动到顶部。我试着scrolltop()方法。它不起作用。有人能帮我一下吗?![在这里输入图像描述][1]

4 个解决方案

#1


4  

Wow! What a coincidence, I just did this today morning. What you need to do is:

哇!真巧,我今天早上才做的。你需要做的是:

// Before calling the modal window...
$("#modalId").scrollTop(0);

Also by using the BootStrap's modal window events API, you can do this:

另外,通过使用BootStrap的模态窗口事件API,您可以做到以下几点:

$('#modalId').on('shown', function() {
    $(this).scrollTop(0);
})

#2


1  

Judging by your image I'm guessing you're wanting to reposition the modal itself to move it off of the screen, as opposed to moving the viewport (which is what scrollTop would do). Check out jQuery's offset function. For example, you could do

从你的图像来看,我猜你是想重新定位模态本身,把它从屏幕上移开,而不是移动viewport (scrollTop就是这么做的)。查看jQuery的偏移函数。例如,你可以这样做

$('#foo').offset({
    top:-$('#foo').outerHeight()
});

Or if you want a smooth scrolling action, use the animate function:

如果你想要一个平滑的滚动动作,可以使用动画函数:

$('#foo').animate({
    top:-$('#foo').outerHeight()
});

#3


0  

On the click event of the button add the relevant jQuery code... I have added that for you.

在按钮的点击事件中添加相关的jQuery代码……我已经给你加了。

<div class="modal-dialog" role="document">
      <div class="modal-content login conatct_main" id="mdlcont">
        <div class="modal-body">
          <div class="row"> 
            <div class="col-md-12">
              <button id="registrsubmit" name="registrsubmit" value="true" class="friends_log pull-right" onclick="$("#modal-content").scrollTop(0);">Register</button>
            </div>  
          </div>
        </div>
      </div>
    </div>

#4


0  

This worked for me:

这工作对我来说:

 $("#myModal .modal-dialog").animate({ scrollTop: 0 }, "slow");

#1


4  

Wow! What a coincidence, I just did this today morning. What you need to do is:

哇!真巧,我今天早上才做的。你需要做的是:

// Before calling the modal window...
$("#modalId").scrollTop(0);

Also by using the BootStrap's modal window events API, you can do this:

另外,通过使用BootStrap的模态窗口事件API,您可以做到以下几点:

$('#modalId').on('shown', function() {
    $(this).scrollTop(0);
})

#2


1  

Judging by your image I'm guessing you're wanting to reposition the modal itself to move it off of the screen, as opposed to moving the viewport (which is what scrollTop would do). Check out jQuery's offset function. For example, you could do

从你的图像来看,我猜你是想重新定位模态本身,把它从屏幕上移开,而不是移动viewport (scrollTop就是这么做的)。查看jQuery的偏移函数。例如,你可以这样做

$('#foo').offset({
    top:-$('#foo').outerHeight()
});

Or if you want a smooth scrolling action, use the animate function:

如果你想要一个平滑的滚动动作,可以使用动画函数:

$('#foo').animate({
    top:-$('#foo').outerHeight()
});

#3


0  

On the click event of the button add the relevant jQuery code... I have added that for you.

在按钮的点击事件中添加相关的jQuery代码……我已经给你加了。

<div class="modal-dialog" role="document">
      <div class="modal-content login conatct_main" id="mdlcont">
        <div class="modal-body">
          <div class="row"> 
            <div class="col-md-12">
              <button id="registrsubmit" name="registrsubmit" value="true" class="friends_log pull-right" onclick="$("#modal-content").scrollTop(0);">Register</button>
            </div>  
          </div>
        </div>
      </div>
    </div>

#4


0  

This worked for me:

这工作对我来说:

 $("#myModal .modal-dialog").animate({ scrollTop: 0 }, "slow");