0

上記の私の質問を赤面するのに問題がありました。誰でも...

これを検索しようとしましたが、私の問題に対処するものは何もないようです。そう...

私は最近、この新しい「もの」(いくつかのウェブサイト)を見てきました。そこでは、固定位置のdiv(ソーシャルメディア)が明らかになりました(表示されます...まるで魔法のように、それがjavascriptまたはjqueryまたはwhathaveyouであることを知っているだけです!)いつページ上の特定のポイントを過ぎてスクロールします。

これが私が欲しいものの例です >>> http://digital-photography-school.com/how-to-photograph-strangers-the-100-strangers-project

ページを下にスクロールすると、ページの左側にあるソーシャル メディア バーが表示されます。

私は独学なので、HTML と CSS は (十分に) 知っています。しかし、javascript / jquery となると、すぐに迷ってしまいます。

では、お願いします、いつ (そしてもし) 回答するか... HTML と CSS 以外に javascript / jquery を提供する場合は、Java / jquery を配置する場所を正確に教えてください。 HTML。

私のプラットフォーム: blogspot (はい、ブロガーで JavaScript を直接ホストする方法を知っているので、外部ファイルやリンクは必要ありません)。追加する場所を教えてください。例: head セクションまたは HTML 自体の真下/真上...希望に満ちた意味がわかります。

現在、自分のページでソーシャル メディアの div を修正しました。スクロール時に特定のポイントを超えて表示できるようにする必要があるだけです。

役に立つ場合は、上記の Web サイトの例と同じ位置、サイズなどを使用してください。自分のサイトにスタイリングを適用するために必要なことは何でもします。

まだ公開する準備ができていないため、実際のサイトへのリンクを投稿できません。

よろしくお願いします。:-)

!!!!!!!!!!アップデート!!!!!!!!!!

OK、少し手間がかかりましたが、このサイトで探していたものを見つけることができました! 私はそれを自分の状況に適応させる必要がありましたが、それは魔法のように機能し、実装するのに数分しかかかりませんでした.

これは、HTML 内の div のすぐ下で使用した JavaScript です。

$(function() {
$(window).scroll(function() {
    if ($(document).scrollTop() > 500) {

        $('#social-media').slideDown(0);

    }else if($(document).scrollTop() < 500){

        $('#social-media').fadeOut(0);
    }
});
})

そして、これはCSSです:

#social-media {
background: white;
width: 150px;
height: auto;
position: fixed;
z-index:1000;
top: 20px;
display: none;
}

トリックをやった!そして、私も自分のqに答えました!誰かが同じ問題を抱えていた場合。

すべてに感謝します - 私は何度もここに来ます - 何年にもわたって私を本当に助けてくれました!

4

0 に答える 0