jqueryが表示または可視性の変化を検出する

Question

クラスのスタイル属性が変更されたかどうかを検出する方法はありますか？たとえば、表示または可視性の変更ですか？

状況には、iframeを介して自分のサイトに埋め込まれたPodioウェブフォームがあり、それには.webforms__success-message > pに隠された感謝のメッセージがあり、ページに表示されるときに成功メッセージにスクロールしたいと思います。

Answer 1

jQueryの代わりにVueJSをおすすめします。バーチャルドームを使用しており、変更を検出するためにドミノをトラバースする必要がないため、高速です。単にアクションを作成し、そのアクションをイベントとして出力するだけです。そして、あなたが望むどんなjQuery関数を呼び出すことができます。

<div id="app"> 
    <iframe v-show="isShowing" src="http://www.weather.gov/" 
     frameborder="0" 
     ></iframe> 
    <button @click="isShowing ^= true">Click Me</button> 
</div> 

CSS

iframe { 
    display:block; 
    margin-top: 20px; 
    margin-left: 200px; 
    width:850px; 
    height:300px; 
} 

JS

var vue = new Vue({ 
    el:"#app", 
    data: { 
    isShowing:false, 
    } 
}) 

チェックアウトこのCodepen