1
<script>
try {
    jQuery(function() {
        jQuery('#video1').VideoPlayer({
            theme: '-vid-skin'              
        });

        $("a.video-link, #video-overlay-shadow").bind("click", function() {
            $("#video-overlay-shadow, #ms-video-overlay").fadeToggle("slow", "linear");
            if($(".Vid-play-button").hasClass("Vid-paused-button")) $(".Vid-play-button").trigger("click");
        });
    });
} catch (e) {
    console.log(lel);
}

</script>

How can I modify this piece of code so that when the screen width reaches 500px it triggers?

4

2 に答える 2

0

jQueryのresizeイベントを使用します。ドキュメントを参照してください。

例えば:

$(window).resize(
    function() {
        if ($(window).width() >= 500) {
            // Do something...
        }
    }
);

もちろん、最初のトリガーの後にウィンドウが500pxよりもさらに広くまたは狭くなる可能性のある状況を考慮する必要があります。


ウィンドウが500pxより広くなったときにこれを一度だけトリガーする必要がある場合は、何らかの方法でそれを確認する必要があります。たとえば、このdataメソッドを使用して、ウィンドウがすでに500pxを超えたことを示すことができます。

$(window).resize(
    function() {
         // Window just went over 500 for the first time
        if ($(window).width() >= 500 && !$(window).data('already_over_500')) {
            $(window).data('already_over_500'); // Set a flag for the first time
            // Do something...

         // Window just went below 500
        } else if ($(window).width() < 500) {
            $(window).data('already_over_500',''); // Unset the flag
            // Do something else...
        }
    }
);
于 2013-01-16T10:55:21.590 に答える
0

これを試して:

$(window).on('resize', function(){
  if($(window).width() >= 500){
    // your code
  }
});
于 2013-01-16T10:57:08.903 に答える