0

これは私のサイトです: http://www.stilld.nl

ポートフォリオまで下にスクロールし、アイテムをクリックします。2 つのことが起こります。

  1. クリックしたポートフォリオ項目の詳細がポートフォリオの下に表示されます。
  2. ページが下にスクロールして、そのポートフォリオ アイテムの詳細が表示されます。

これは正常に機能しています。これは、ピクセル数だけ下にスクロールするためです。

問題: ブラウザを下にスクロールすると、ポートフォリオが互いの下に項目に変わっているのがわかります。さて、アイテムをクリックすると、下にスクロールしなければならないと私が言ったピクセルの量だけ下にスクロールしますが、それは今のところ十分ではありません.

私の解決策（うまくいきませんでした）：数字を下にスクロールする代わりに、クラスまで下にスクロールしようとしました。これは機能するはずですが、コードが機能していません。ページの一番上までスクロールするだけです。これは、CLASS が表示されると同時に (またはそれよりも前に) スクロール ダウンが呼び出されるために発生すると思います。これは私の最初のコードです (そして on を使用します:

$(document).ready(function(){
$(".portfolio").click(function () {
    if ($('#'+$(this).attr('target')).is(':visible')){
        $('#'+$(this).attr('target')).slideUp();        
    } else {
        $('.description').slideUp(); 
        $('#'+$(this).attr('target')).slideDown();        
        $('html, body').animate({scrollTop: $('#targetWrapper').offset().top + 600 }, 600);
    }

});
$(".close").click(function () {
    $('.description').slideUp();        
    $('html, body').animate({scrollTop: $('.p_img').offset().top }, 600);
});

});

私が欲しいもの:

このコードを、クラスまたは ID まで下にスクロールするコードに変換したいと考えています。ただし、これは CLASS または ID が表示された後に発生する必要があります。それが解決策であるべきだと思います。

4

1 に答える 1