0

Jquery の動作を変更し、wordpress の Web サイトに追加しようとしています。

最初にやりたいことは、ナビゲーションでページをクリックするたびに、ページをフェードインさせ、ページが上にスクロールしたように見せることです。フェスを機能させることはできますが、ページを上にスクロールしたり、少なくとも効果を得ることができません。

<script language="Javascript">
    $(document).ready(function(){   
        $('body').fadeIn(1000);
    });
</script>

2 番目の問題は、ロールオーバーしたときに画像のキャプションを表示する画像があることです。フェードインしたいのですが、キャプションを上にスクロールします。

<script type="text/javascript">

    $(document).ready(function() {

        //move the image in pixel
        var move = -15;

        //zoom percentage, 1.2 =120%
        var zoom = 1.1;

        //On mouse over those thumbnail
        $('#client-rank .client-img').hover(function() {

            //Set the width and height according to the zoom percentage
            width = $('#client-rank .client-img').width() * zoom;
            height = $('#client-rank .client-img').height() * zoom;

            //Move and zoom the image
            $(this).find('#client-rank .client-img img').stop(false,true)
                .animate({
                    'width': width, 
                    'height': height, 
                    'top': move, 
                    'left': move
                }, {duration:200});

            //Display the caption
            $(this).find('div.caption').stop(false,true).fadeIn(200);

        },
        function() {
            //Reset the image
            $(this).find('img').stop(false,true)
                .animate({
                    'width': $('.item').width(), 
                    'height': $('.item').height(), 
                    'top': '0', 
                    'left': '0'
                }, {duration:100}); 

            //Hide the caption
            $(this).find('div.caption').stop(false,true).fadeOut(200);
        });

    });

</script>

[リンク ]http://test-cocoonfxmedia.co.uk/elevate/clients!

アドバイスをいただければ幸いです。

4

0 に答える 0