0
バーをクリックするとjquery .htmlメソッドを使用してHTMLコンテンツを展開して読み込むjqueryスクリプトが私のWebページに含まれています。この方法で expandable jquery windowjquery .htmlメソッドを使用してWebページ全体を読み込む方法は？
#processmap {
\t height: 20px;
\t position: fixed;
\t top: 0px;
\t left: 20px;
\t right: 20px;
font-size: .8em;
\t color: white;
\t text-align: center;
\t background-color: #EF7100;
\t box-shadow: 0px 11px 5px -10px rgba(153,153,153,1);
\t border-radius: 0 0 5px 5px;
\t z-index: 999;
\t font-family: 'Open Sans', sans-serif;
\t padding-bottom: 2px;
}<!DOCTYPE html>
<!-- Please ensure that no elements, particularly pictures, exceed 480 px width. -->
<html>
\t <head>
\t \t <link type="text/css" rel="stylesheet" href="css/main.css"/>
\t \t <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
\t \t <script>
\t \t \t $(document).ready(function(){
\t \t \t \t $("#processmap").click(function() {
\t \t \t \t \t if ($(this).height() > 20) {
\t \t \t \t \t \t $(this).animate({
\t \t \t \t \t \t \t height: "20px"
\t \t \t \t \t \t }, 300, 'swing', function() {
\t \t \t \t \t \t \t $(this).html("Open Business Process Map");
\t \t \t \t \t \t });
\t \t \t \t \t } else {
\t \t \t \t \t \t var content = 'Close this window.</br><iframe style="top: 20px; height:100%; width: 100%; margin:0; padding:0; overflow:hidden" src="processmap_project.html"></iframe>'
\t \t \t \t \t \t $(this).animate({
\t \t \t \t \t \t \t height: "150px"
\t \t \t \t \t \t }, 300, 'swing', function() {
\t \t \t \t \t \t $(this).html(content);
\t \t \t \t \t \t });
\t \t \t \t \t }
\t \t \t \t });
\t \t \t });
\t \t </script>
\t </head>
\t <body>
\t \t <div id="processmap">
\t \t \t Open Business Process Map
\t \t </div>
\t \t <iframe id="art" style="height:100%; width:100%; align:top; border:none; overflow:scroll" src="https://***"></iframe>
\t </body>
</html>、私は、拡張ウィンドウに全体iFrameをロードしたいと思います。しかし、私は、JavaScriptコード内のiframeの書式設定がうまくいかないと考えました。 （ガスケットと余白をピックアップされていません。）
<script>
\t $(document).ready(function(){
\t \t $("#processmap").click(function() {
\t \t \t if ($(this).height() > 20) {
\t \t \t \t $(this).animate({
\t \t \t \t \t height: "20px"
\t \t \t \t }, 300, 'swing', function() {
\t \t \t \t \t $(this).html("Open Business Process Map");
\t \t \t \t });
\t \t \t } else {
\t \t \t \t var content = 'processmap_shell.html'
\t \t \t \t $(this).animate({
\t \t \t \t \t height: "150px"
\t \t \t \t }, 300, 'swing', function() {
\t \t \t \t $(this).html(content);
\t \t \t \t });
\t \t \t }
\t \t });
\t });
</script><!DOCTYPE html>
<!-- Please ensure that no elements, particularly pictures, exceed 480 px width. -->
<html>
\t <head>
\t \t <link type="text/css" rel="stylesheet" href="css/main.css"/>
\t </head>
\t <body>
\t \t Close this window.</br>
\t \t <iframe id="process" src="processmap_project.html"></iframe>
\t </body>
</html>触知、$（この）の.html（ 'processmap_shell.html'）は動作しません。代わりにウィンドウにprocessmap_shell.htmlというページを読み込むことができますか？main.cssをより簡単に参照できるようになりますか？
おそらく最も効果的な方法です。 – Tinsten