Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- import React, { Component } from 'react';
- import './App.css';
- class App extends Component {
- render() {
- return (
- <div className="App">
- <header className="App-header">
- <h1 className="App-title">My Sticky Bar demo</h1>
- <h3 className="App-subtitle">Scroll down to see the sticky effect....</h3>
- </header>
- </div>
- <div className="App-content">
- <h3>On Scroll Sticky Header</h3>
- <p>The header will stick to the top when you reach its scroll position.</p>
- <p>Scroll back up to remove the sticky effect.</p>
- <p>Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo,
- maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam
- omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no
- molestiae voluptatibus.</p>
- <p>Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo,
- maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam
- omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no
- molestiae voluptatibus.</p>
- <p>Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo,
- maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam
- omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no
- molestiae voluptatibus.</p>
- <p>Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo,
- maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam
- omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no
- molestiae voluptatibus.</p>
- <p>Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo,
- maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam
- omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no
- molestiae voluptatibus.</p>
- </div>
- );
- }
- }
- export default App;
Add Comment
Please, Sign In to add comment