如何顯示的iframe使用jQuery

我做一個簡單的項目，我想和方法顯示的iframe的jQuery .show()，我告訴jQuery的主網站，我嘗試這樣做：如何顯示的iframe使用jQuery

$(function() { 
 
    // run the currently selected effect 
 
    function runEffect() { 
 
    // get effect type from 
 
    var selectedEffect = $("#effectTypes").val(); 
 

 
    // most effect types need no options passed by default 
 
    var options = {}; 
 
    // some effects have required parameters 
 
    if (selectedEffect === "scale") { 
 
     options = { percent: 100 }; 
 
    } else if (selectedEffect === "size") { 
 
     options = { to: { width: 280, height: 185 } }; 
 
    } 
 

 
    // run the effect 
 
    $("#effect").show("blind", options, 500, callback); 
 
    }; 
 

 
    //callback function to bring a hidden box back 
 
    function callback() { 
 
    setTimeout(function() { 
 
     $("#effect:visible").removeAttr("style").fadeOut(); 
 
    }, 1000); 
 
    }; 
 

 
    // set effect from select menu value 
 
    $("#button").click(function() { 
 
    runEffect(); 
 
    }); 
 
});

<link rel="stylesheet" href="css/style.css"/> 
 
<script src="//code.jquery.com/jquery-1.10.2.js"></script> 
 
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
 
<div align="center"><b>Sorveglianza RaspiCam</b></div> 
 

 
<div id="effect" class="sorv"> 
 
    <iframe src='http://www.sito.it' width='1024' height='640'></iframe> 
 
</div> 
 

 
<button id="button" class="ui-state-default ui-corner-all">Run Effect</button>

但該按鈕不起作用，iframe永遠不可見，我錯了？謝謝，丹尼爾。

來源

2016-02-17 skatedan

你在你的html中有一些問題。我修復了它們，現在看來它工作。是不是？ –

@MoshFeu - 你是說你編輯了問題以消除問題，因此它不再是一個有效的問題？ – Quentin

是的，如果我理解了這個問題，當你點擊「運行效果」按鈕時，iframe應該淡出，但不是。現在，它確實。 –

1-樣式錶鏈接不正確。 2- $(function()劑量未關閉。下面的代碼應該可以工作：

<html> 
    <head> 
    <title>RaspiCam</title> 
     <link rel="stylesheet" type="text/css" href="css/style.css"> 
     <script src="http://code.jquery.com/jquery-1.10.2.js"></script> 
     <script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js"></script> 
     <script> 
    $(function() { 
    // run the currently selected effect 
    function runEffect() { 
     // get effect type from 
     var selectedEffect = $("#effectTypes").val(); 

     // most effect types need no options passed by default 
     var options = {}; 
     // some effects have required parameters 
     if (selectedEffect === "scale") { 
     options = { percent: 100 }; 
     } else if (selectedEffect === "size") { 
     options = { to: { width: 280, height: 185 } }; 
     } 

     // run the effect 
     $("#effect").show("blind", options, 500, callback); 
    }; 

    //callback function to bring a hidden box back 
    function callback() { 
     setTimeout(function() { 
     $("#effect:visible").removeAttr("style").fadeOut(); 
     }, 1000); 
    }; 

    // set effect from select menu value 
    $("#button").click(function() { 
     runEffect(); 
    }); 
    }); 
    </script>    
    </head> 
    <body> 
     <div align="center"><b>Sorveglianza RaspiCam</b></div> 

     <div id="effect" class="sorv"> 
      <iframe src='http://www.sito.it' width='1024' height='640'></iframe> 
     </div> 

     <button id="button" class="ui-state-default ui-corner-all">Run Effect</button> 
    </body> 
</html>

來源

2016-02-17 12:02:01

我已經嘗試了您的建議，並且我感謝您，但是，這不起作用。當我看到頁面iframe必須隱藏，看看我是否按下按鈕，對不起我的壞英語，但我是意大利人，我希望你明白。 – skatedan

如何顯示的iframe使用jQuery

回答

相關問題