ボタンを使ってiframeを切り替えようとしています

Question

私はユーザー入力で切り替えようとしている画像比較スライダーを持っています。私はちょうど単純なボタンでそれをしたいが、それは動作しません、そして、なぜ私は理解できません。

これは私が使用していますコードです：

<iframe frameborder="0" class="iframe1" width="300" height="300" src="https://cdn.knightlab.com/libs/juxtapose/latest/embed/index.html?uid=019dc5e8-1631-11e7-9577-0edaf8f81e27"></iframe> 
<button class="button1">toggle slider</button> 

。

function hideToggle(button, elem) { 

    $(button).toggle(
    function() { 
     $(elem).hide(); 
    }, 
    function() { 
     $(elem).show(); 
    } 
); 
} 

hideToggle(".button1", ".iframe1"); 

Fiddle

Answer 1

私は多分、あなたのJSFiddleはjQueryのを持っていなかった、あなたのiframe要素でtoggle機能を使用してみてください気づいた：ここ

function hideToggle(button, elem) { 
    $(button).click(function() { 
    $(elem).toggle(); 
    }); 
} 

hideToggle(".button1", ".iframe1"); 

あなたは何であるかどうかを確認することができますあなたがしようとしている。

function hideToggle(button, elem) { 
 
    $(button).click(function() { $(elem).toggle('show'); }); 
 
} 
 
hideToggle(".button1", ".iframe1");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script> 
 
<iframe frameborder="0" class="iframe1" width="300" height="300" src="https://cdn.knightlab.com/libs/juxtapose/latest/embed/index.html?uid=019dc5e8-1631-11e7-9577-0edaf8f81e27"></iframe> 
 
<button class="button1">toggle slider</button>