2016-08-09 16 views
-2

私はポートフォリオのアイデアを探していましたが、私はシンプルで美しいデザインでこの特定のものを見つけました。私は現在、このレイアウトを実装する方法、特にそれを固執する要素については迷っています。私は自分のコードを比較する必要はありませんが、誰かがそれがどのように機能するかを理解する手助けができますか?ありがとう!左にスティッキーdiv、右にスクロール

http://melaniedaveid.com/

も:私は、コンセプトは一つのセクションだけではない第二のために働くことを得ることができます。 (つまり、「仕事」セクションに「概要」セクションから行く。

+0

コードを表示するのに 'F12'を押すことができます –

+0

私はそれを実装する方法を知りません。 – Caelitaten

+0

すべてのウェブサイトのリソースが公開されています、CSS、JS ... etc ...あなたが必要とするのは、リバースエンジニアリング、devtools、リサーチとボイラーのビットです。 – KAD

答えて

0

あなたが探しているものがスティッキーポジショニングである。 そのようなことを実現するには、いくつかのアプローチがあります。良い概要がhereを見つけることができます。

私はあなたが今ではそれを使用することができますposition--sticky-などから選択するpolyfillsの幸いが多数。最も簡単な解決策はposition:sticky; CSSプロパティを使用することだと思います。しかし、それは多くのブラウザでサポートされていないです!

どのようにposition:sticky;を使用するのですか?また、sp ecify top値は必須であり、要素が固着する上端からの距離を指定します。だからほとんどそれはtop: 0;になりたい。そして、スクロールすると、要素の上端からの距離が0になると、要素がスティックされます。

関連する問題