2017-06-13 10 views
0

私はSharePoint Onlineで作業していますが、この問題についていくつかの調査を行っていますが、私はそれを理解することができないので、私のSPサイトの特定の部分を最初から作り直すことを考えています。バックグラウンドでSharePointサイトにアクセスしている間にWebサイトを開くダイアログボックスを作成するにはどうすればよいですか?

私は、物品のテーブルを作成してサイドに参照資料へのリンクを張っていますが、同じSPサイトにいる間に参照資料のウェブサイトをボックス内に表示するダイアログボックスまたはiFrameを作成する必要がありました背景。 このような種類の - >http://demos.jquerymobile.com/1.4.0/popup-iframe/

このデモにはビデオと地図がロードされていますが、ウェブサイト全体をボックス内に読み込むようにしました。

<!DOCTYPE html> 
<html> 
<head> 
<style> 
body {font-family: "Lato", sans-serif;} 
/* Spacer for template*/ 
td.spacer { 
       margin-left: 100px 
      } 
/* Style the tab */ 
div.tab { 
    overflow: hidden; 
    border: 1px solid #ccc; 
    background-color: #f1f1f1; 
} 

/* Style the buttons inside the tab */ 
div.tab button { 
    background-color: inherit; 
    float: left; 
    border: none; 
    outline: none; 
    cursor: pointer; 
    padding: 14px 16px; 
    transition: 0.3s; 
    font-size: 17px; 
} 


/* Change background color of buttons on hover */ 
div.tab button:hover { 
    background-color: #ddd; 
} 

/* Create an active/current tablink class */ 
div.tab button.active { 
    background-color: #ccc; 
} 

/* Style the tab content */ 
.tabcontent { 
    display: none; 
    padding: 6px 12px; 
    border: 1px solid #ccc; 
    border-top: none; 
} 



</style> 
</head> 
<body> 
<div class="tab"> 
    <button class="tablinks" onclick="openLink(event, 'Tab1')">Tab1</button> 
<button class="tablinks" onclick="openLink(event, 'Tab2')">Tab2</button> 
</div> 

<div id="Systems Design" class="tabcontent"> 
<table style="width:50%"> 
    <th> Description </th> 
    <th> Link </th> 
     <tr> 
      <td>Desc1</td>   
      <td style="width:25%"> <a href = "https://www.google.com">Click 
Here</a></td> 
     </tr> 
     <tr> 
      <td>Desc2 </td> 
      <td> <a href = "https://www.google.com">Click Here</a></td> 
     </tr> 
</div> 
</body> 
</html> 

答えて

0

iframeが厄介なことがあります。多くのウェブサイトでは、同じ原点リクエストのみが許可されます。つまり、iframeは独自のドメインではないリソースとしてレンダリングされません。また、セキュリティが一致する必要があります。つまり、httpサイトでhttps iframeを読み込めません。回避策は、imgタグとそのポップアップ内のサイトのスクリーンショットを使用することです。

+0

機能ウェブサイトを表示するためのダイアログボックスを表示する方法はありますか? – TheJappad

+0

新しいブラウザウィンドウを開いて、より小さなサイズにして、 'window.open( 'https://google.com'、 'windowName'、 'top = 50、width = 700、left = 100、高さ= 500 ') ' –

関連する問題