0

画像（このページのサムネイル）を垂直方向に中央揃えするために、これを試しました：

//Center the images (thumbnails) in the slideimg.js
$(document).ready(function() {
    $('.work-view img').load(function(){
        //get img dimensions
        var h = $(this).height();
//alert(h);
        //set img position
        $(this).css('position','absolute');
        $(this).css('top','50%');
        $(this).css('margin-top',-Math.round(h/2) + 'px');
    });
});

ただし、Chromeでは機能しますが、Firefoxではキャッシュに画像があり、.loadは画像の読み込み専用であるため、Firefoxでは機能しません。だから私はこれを試しています：

//Center the images (thumbnails) in the slideimg.js
$(document).ready(function() {
    function imageLoaded() { // function to invoke for loaded image
    //get img dimensions
    var h = $(this).height();
//alert(h);
    //set img position
    $(this).css('position','absolute');
    $(this).css('top','50%');
    $(this).css('margin-top',-Math.round(h/2) + 'px');
    }
    $('.work-view img').each(function(){
    if( this.complete ) {
        imageLoaded.call( this );
    } else {
        $(this).one('load', imageLoaded);
    }
    });
});

しかし、それは機能しません...$(this).css('position','absolute');それらを水平に残すのではなく、右にシフトします...私は何か間違ったことをしましたか?

4

1 に答える 1

0

これを試してみてください。イメージのターゲットを失っていると思います。

//Center the images (thumbnails) in the slideimg.js
function imageLoaded(thisImage) { // function to invoke for loaded image
  //get img dimensions
  var h = $(thisImage).height();
  //set img position
  $(thisImage).css('position','absolute');
  $(thisImage).css('top','50%');
  $(thisImage).css('margin-top',-Math.round(h/2) + 'px');
}
$(document).ready(function() {
 $('.work-view img').each(function(){
  if( this.complete ) {
    imageLoaded.call( this );
  } else {
    var self = this;
    $(this).one('load', function(){ imageLoaded(self); });
  }
 });
});

私がしたことは、関数を除外し、関数に複数回渡そうとしているため、関数に引数を追加することthisでしたが、関数は引数を受け入れませんでした。関数でthisは、書かれているように を参照していましたwindow。

于 2012-10-16T19:13:07.097 に答える