変更のスタイルのプロパティ私はこれはiframeを持って

Question

をクリックします。クリックしたとき

<iframe src="http://www.example.org" frameborder="0" style="top: -200; left: -650; width: 950; height: 800; border: 0; border:none;" scrolling="no" sandbox="allow-controls"></iframe> 

：

<iframe src="http://www.example.org" frameborder="0" style="top: -100; left: -250; width: 400; height: 590; border: 0; border:none;" scrolling="no" sandbox="allow-controls"></iframe> 

私はそれが自動的に を変更します。正確かつ基本的に私はtop、left、width、heightのプロパティを変更したいと思います。

それは可能ですか？もしそうなら、どうですか？ "jqueryの中にスタイルを変更する方法"

Answer 1

Googleだけ

ヒント：それは.click()と.css()

http://api.jquery.com/css/

https://api.jquery.com/click/

jquery change style of a div on click

Answer 2

Clickイベントがでサポートされていない使用していますiframe。あなたはそれを実現させるためにいくつかの "魔法"を使わなければなりません。基本的には、イベントを処理できるコンテナをラップする必要があります。実際にはあなたを助けるかもしれないjQueryプラグインがあります。それは次の場所にあります。ここでは

https://github.com/vincepare/iframeTracker-jquery

は、このプラグインを使用して、インラインフレームの幅だけを変更するコードのスニペットです....それが役に立てば幸い。

<div class="iframetrack" id="iframe_red_1"> 
    <iframe id="theFrame" src="http://www.example.org" style="border: 0; 
     border:none; top: 100px; left: 100px; width: 500px; height: 250px;" 
     frameborder="0" scrolling="no" sandbox="allow-controls" > 
    </iframe> 
</div> 

@section Scripts 
{ 
<script> 

    $(document).ready(function ($) { 

     $('.iframetrack iframe').iframeTracker({ 

      blurCallback: function() { 
       $('#theFrame').css('width', '200px'); 
      }, 
      overCallback: function (element) { 
       this._overId = $(element).parents('.iframe_wrap').attr('id'); // Saving the iframe wrapper id 
      }, 
      outCallback: function (element) { 
       this._overId = null; // Reset hover iframe wrapper id 
      }, 
      _overId: null 
     }); 

    }); 

}