Simple Overlay

See the Pen simpleOverlay by Iva Popova (@webdesigncourse) on CodePen.

Simple overlay with pseudo element

See the Pen simpleOverlayWithPseudoElement by Iva Popova (@webdesigncourse) on CodePen.

Overlay

See the Pen simple_overlay_demo by Iva Popova (@webdesigncourse) on CodePen.

Show and animate image on hover

See the Pen animatedHelloEffect by Iva Popova (@webdesigncourse) on CodePen.

Filter/Opacity on BG Image Only

See the Pen Untitled by Iva Popova (@webdesigncourse) on CodePen.

See the Pen StaticParalax_CSS_Simplest by Iva Popova (@webdesigncourse) on CodePen.

SmoothScrollingWithHashLinks-PureJS

See the Pen SmoothScrollingWithHashLinks-PureJS by Iva Popova (@webdesigncourse) on CodePen.

Animated Scroll with AOS

Анимирани скрол ефекти от библиотеката: AOS

See the Pen Animated Scroll with AOS by Iva Popova (@webdesigncourse) on CodePen.

CSS Only Parallax Scroll With Transform

See the Pen CSS Only Parallax Scroll by Iva Popova (@webdesigncourse) on CodePen.

Simple Parallax With Vanilla JS

See the Pen SimpleParallaxWithVanillaJS by Iva Popova (@webdesigncourse) on CodePen.

Change Header opacity on scroll

See the Pen changeHeaderOpacityOnScroll by Iva Popova (@webdesigncourse) on CodePen.

Drop-Down Vertical Menu - show on Hover

See the Pen Drop-Down Vertical Menu - show on Hover by Iva Popova (@webdesigncourse) on CodePen.

Drop-Down Vertical Menu - show on Click

See the Pen Drop-Down Vertical Menu - show on Click by Iva Popova (@webdesigncourse) on CodePen.

Slider With Interval And Clearing

See the Pen Slider With Interval And Clearing by Iva Popova (@webdesigncourse) on CodePen.

Load Multiple content in one div

See the Pen multimpleContentInOneDiv by Iva Popova (@webdesigncourse) on CodePen.

Simple Accordion with Pure JS and CSS animation

See the Pen Simple Accordeon with Pure JS and CSS animation by Iva Popova (@webdesigncourse) on CodePen.

Sound on hover - simplest

See the Pen Sound on hover - simplest by Iva Popova (@webdesigncourse) on CodePen.

Sounds on hover - on various items

See the Pen Sounds on hover - on various items by Iva Popova (@webdesigncourse) on CodePen.

Animated letter balloons

See the Pen Animated Baloons (CSS Only) by Iva Popova (@webdesigncourse) on CodePen.

codepen

Моята колекция с всички примери в тази тема.

Освен статиите и примерите в сайта css-tricks.com бихте могли да разгледате и примерите, които са качили в CSS-tricks @codepen

Примери за най-различни компоненти и трикове: W3Schools How To