Slider without Javascript. Learned from Online Tutorial
Page here
Github Download
Step1:
HTML
There is five slide section among the div classed slider.
The container is the paragraph outside the slider.
Each slide gets some words content and an image as background showing.
Step2:
CSS
Google font imported.
The slider takes 100%width with the position.
Each slide should be hidden with infinite animation named slider.
0%-5% transform visibility from hidden to visible,meanwhile the opacity 0 to 1.
5%-25% stay visible
25%-30% transform visibility and opacity
The style of image and content is the upper layer of the image.
The animation-delay every four seconds for each slide.
More CSS slider examples:
View swither without js
CSS slider without js
👉Follow me for more useful web development content! love sharing🥰
