Fixed Podcast Player
See the GitHub Readme for info on the Web Component's attributes and overriding the CSS variables.
An audio player revealed when its Play button is scrolled into view
- can be closed or moved to the top
- position, vloume, and playback speed are preserved in
localStorage - styles are fully encapsulated using Declarative Shadow DOM
Scroll down 👇
Lorem ipsum dolor sit amet consectetur adipisicing elit. Laudantium explicabo voluptatem quos error itaque illum nihil, optio illo dicta maiores, deleniti nemo aperiam, doloribus nostrum quas reprehenderit exercitationem vitae esse.
Atque voluptates optio eaque sed asperiores delectus corrupti voluptas architecto recusandae quis perspiciatis ratione dignissimos cum praesentium, placeat est ea pariatur. Odio aspernatur quas blanditiis quia repellendus voluptatem totam harum?
Quas voluptatum beatae ullam nihil aspernatur debitis suscipit culpa sed molestias eius ipsum libero vitae incidunt consequatur architecto, fugit odio repudiandae rem? Libero, mollitia ipsam ducimus necessitatibus atque aliquam dicta.
Quos quaerat, esse quo architecto atque quasi ut blanditiis inventore alias harum nobis provident, dolorum odio odit aliquid itaque doloremque perspiciatis numquam qui, quae eaque delectus fugit aperiam. Voluptate, quaerat.
Eius amet, nulla, animi tenetur deleniti illum quod blanditiis iure repellat consectetur aperiam. Eligendi quos aperiam ex deleniti tenetur nulla molestiae magnam quasi fugit, voluptatem ut veritatis quia reiciendis mollitia!
Ut quos commodi explicabo praesentium quaerat modi cumque facilis hic at quam sunt voluptatum ipsa corporis necessitatibus eius minus nostrum, aperiam atque nobis excepturi sapiente quae tenetur officiis dolorem? Illo.
Iste atque tempora eligendi dicta commodi cum quis laboriosam aut culpa libero, debitis, doloremque laborum et excepturi mollitia optio tenetur nemo nulla quod! Ipsum repellat, provident earum beatae dolore assumenda.
Adipisci culpa laudantium est nostrum reprehenderit quaerat, sed hic accusantium! Aliquam, ut! Aut a optio fugiat provident accusamus, illo quibusdam hic fuga cupiditate porro amet, error soluta, corrupti natus architecto!
Temporibus possimus ipsa sit nihil sunt sint architecto placeat dolorum voluptates consequatur, dolore aperiam voluptatibus deserunt neque, aut eius laboriosam nulla et. Illum, facilis quasi omnis placeat quisquam necessitatibus quo.
Cum dignissimos, modi explicabo repellat dolorum quam? Minima molestiae quae dolor doloribus asperiores non sint eum laudantium, fugit fuga vero provident commodi aliquam. Delectus, deserunt aliquid. Molestias ea repellat sapiente.
Dolorum repellat eligendi praesentium quisquam dignissimos provident aliquid quis? Tenetur cumque quam dicta, exercitationem itaque odio! Consequuntur eligendi voluptatum inventore maiores aliquam cupiditate reiciendis quaerat atque similique, dignissimos nobis voluptatem.
Sint vitae ipsa optio dolor nulla recusandae accusamus illum! Dolor in asperiores facere blanditiis obcaecati ad, laborum libero veritatis cupiditate pariatur delectus ducimus consectetur deleniti nostrum temporibus voluptatum beatae minus.
Nostrum repudiandae at, recusandae neque voluptate explicabo saepe laudantium voluptatem aliquam excepturi blanditiis veniam atque quod iusto dolore debitis voluptates suscipit mollitia minus quidem obcaecati architecto facere. Nisi, laborum ab.
Ea corrupti consectetur inventore quibusdam, quisquam odio dolore provident fuga quod odit voluptatibus itaque asperiores facere eos eveniet, facilis nisi quae cumque praesentium esse sunt, quia dolorum sint laborum. Id?
Fuga libero minima minus necessitatibus, illo esse ad soluta distinctio officiis porro voluptatem consectetur recusandae deleniti eaque excepturi dicta quibusdam tempora cumque atque! Fugiat iusto officiis saepe nostrum soluta nesciunt.
Tempore totam quo cupiditate, ratione delectus sit eligendi aliquid quidem, velit iste itaque pariatur eius nostrum a dolores culpa voluptatem, minus accusantium asperiores. At nam doloribus est molestiae, provident explicabo?
Perspiciatis enim nostrum voluptatum consequatur, vitae earum itaque officiis dolores deleniti molestiae, id necessitatibus nam eius. Nostrum ratione incidunt, eaque provident accusamus earum, omnis velit similique nobis, eos vel nesciunt?
Illo facere recusandae ducimus maxime! Molestias ducimus asperiores vitae officia iure beatae praesentium expedita dolor repellat nisi, quibusdam fugit odio, obcaecati accusamus perferendis quaerat sit, dicta neque modi voluptatem porro?
Reprehenderit obcaecati vitae maxime illo in suscipit quo a molestiae veniam iusto eveniet temporibus, ullam nisi sit hic quas doloremque? Quam nam sed ab adipisci blanditiis perspiciatis fugiat beatae quod!