内部にページを含むモーダルを表示するボタン

Question

JQueryまたはAjaxスクリプトを入力するにはどうすればいいですか（たとえば）<button>WORLDS</button>は同じページにあるincludeのページをモーダルで表示します。

Answer 1

あなたはコードを提供していませんが、あなたの質問にお答えします。あなたは、外部のページの一部にiframeを使用することができます。

$('button').on('click', function() { 
 
    $('.overlay, .popup').fadeIn(); 
 
}); 
 
$('.overlay').on('click', function() { 
 
    $('.overlay, .popup').fadeOut(); 
 
});

.overlay { 
 
    background: rgba(0, 0, 0, 0.7); 
 
    position: fixed; 
 
    top: 0; 
 
    left: 0; 
 
    height: 100%; 
 
    width: 100%; 
 
    display: none; 
 
} 
 
.popup { 
 
    background: #fff; 
 
    padding: 20px 20px; 
 
    box-sizing: border-box; 
 
    max-width: 300px; 
 
    width: 100%; 
 
    margin: 50px auto 0px auto; 
 
} 
 
iframe { 
 
    width: 100%; 
 
    height: auto; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button>WORLDS</button> 
 
<div class='overlay'> 
 
    <div class='popup'> 
 
    <iframe width='' src="http://stackoverflow.com/"></iframe> 
 
    </div> 
 
</div>

に