关闭模态并滚动到 div [英] Close modal and scroll to div

查看:39
本文介绍了关闭模态并滚动到 div的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

$("#contact-form").click(function() {$('html, body').animate({scrollTop: $("#contact-section").offset().top}, 2000);});

<div class="modal-body">文本

<div class="modal-footer"><button type="button" id="contact-form" class="btn btn-default pull-right glyphicon glyphicon-envelope">联系方式</button>

<div id="contact-section"><?php 需要 'contact.php';?>

当我点击联系时,引导模式按预期关闭,但没有滚动到联系部分,为什么?

解决方案

不要使用 data-dismiss="modal"

$("#contact-form").click(function() {
    $('html, body').animate({
        scrollTop: $("#contact-section").offset().top
    }, 2000);
});

<div class="modal fade" id="saModal" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h3>title</h3>
            </div>
            <div class="modal-body">
                text
            </div>
            <div class="modal-footer">
                <button type="button" id="contact-form" class="btn btn-default pull-right glyphicon glyphicon-envelope">Contact</button>
            </div>
        </div>
    </div>
</div>

<div id="contact-section">
<?php require 'contact.php'; ?>
</div>

When I click contact, The bootstrap modal closes as expected but doesn't scroll to contact section, why?

解决方案

Don't use the data-dismiss="modal"

<button type="button" id="contact-form" class="btn btn-default pull-right glyphicon glyphicon-envelope" >Contact</button> 

$("#contact-form").click(function() {
    $('#myModal').modal('hide');
    $('html, body').animate({
        scrollTop: $("#contact-section").offset().top
    }, 2000);
});

这篇关于关闭模态并滚动到 div的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆