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!
アドバイスをいただければ幸いです。