2

jQuery waypoints プラグインを使用しています。これは、スクロールする前にページの読み込み時にコンソールメッセージが発生することを除いて、正常に機能しています。これは、画像に適用されている表示ブロックを削除すると停止しますが、サイトが機能するにはこれが必要です。

<!DOCTYPE html>
<html>
    <head>
        <title>Test</title>
        <script src="js/jquery-2.0.3.js"></script>
        <script src="js/waypoints.js"></script>
        <style>
            body {
                margin: 0;
                padding: 0;
            }
            img {
                max-width: 100%;
                display: block;
                margin: auto;
            }
            #img3 {
                opacity: 0.5;
            }

        </style>
        <script>
            $(document).ready(function() {
                $('#img3').waypoint(function() {
                  console.log('Basic example callback triggered.');
                });
            });
        </script>
    <body>
        <img src="images/1.jpg" alt="image 1" id="img1">
        <img src="images/2.jpg" alt="image 2" id="img2">
        <img src="images/3.jpg" alt="image 3" id="img3">
        <img src="images/4.jpg" alt="image 4" id="img4">
    </body>
</html>
4

1 に答える 1