2017-06-19 92 views
-1

你好,我是新來的Wordpress, 我有一個按鈕,它是放在我的文章底部的快速查詢。 我想打開該按鈕的點擊iframe。如何在wordpress中點擊按鈕時顯示iframe彈出框?

我嘗試了一個名爲iframe中彈出插件,

<button style="background-color: #232254; text-decoration: none; color: #ffffff; width: 200px; height: 50px; border-radius: 15px 15px 15px;" onclick="forIframe();">Quick Enquiry</button> 

<script type="text/javascript"> 
function forIframe() 
{[iframe-popup category="Category1"];}</script> 
</div> 

但沒有什麼工作。

http://www.ithink.co/support_ticketing_system.html

請訪問此鏈接,你會看到一個快捷的查詢按鈕。我想要它完全一樣。 謝謝。

+0

使用引導其在這裏工作 –

+0

罰款給出的鏈接是我想在我的WordPress郵寄來重新創建一個實例創建彈出。 - @RajKumarBhardwaj – Intern

+0

你使用bootstrap嗎? –

回答

0

您可以在WordPress

<!DOCTYPE html> 
    <html lang="en"> 
    <head> 
     <title>Bootstrap Example</title> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    </head> 
    <body> 

    <div class="container"> 
     <h2>Modal Example</h2> 
     <!-- Trigger the modal with a button --> 
     <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Quick Enquiry</button> 

     <!-- Modal --> 
     <div class="modal fade" id="myModal" role="dialog"> 
     <div class="modal-dialog"> 

      <!-- Modal content--> 
      <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal">&times;</button> 
       <h4 class="modal-title">Quick Enquiry</h4> 
      </div> 
      <div class="modal-body"> 
       <p>[iframe-popup category="Category1"]</p> 
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
      </div> 
      </div> 

     </div> 
     </div> 

    </div> 

    </body> 
    </html> 
+0

非常感謝你! – Intern

+0

歡迎:) 樂意幫忙 –

相關問題