How to use CSS to achieve the sliding effect of the picture? Example

This article mainly introduces you to the CSS implementation of the image of the sliding effect example, I hope you read this article after the CSS sliding effect of the relevant knowledge to understand.

Here is an example of a simple CSS image slide effect (swipe up from the bottom):

<! DOCTYPE html>
The above code can be copied directly on the local test effect such as:



As long as the mouse click on the button below, there will be a bottom-up picture of the slide effect. There is an onclick attribute, triggered by a mouse click on the element, which executes a piece of JavaScript when the button is clicked.

Note: The OnClick property does not apply to the following elements:<base>, <bdo>, <br>,