BlendTrans Filter with CSS

xiaoxiao2021-03-06  93

Author: Fengyong Yao

BlendTrans Filter is simpler than the ReveAltrans filter introduced by the previous introduction, it has only one parameter: Duration transform time, its function is also a single, which is an effect of fade into fade, but it's this effect ratio The fade of the REVEALTRANS filter will be fine, and you will see it.

Figure 1 first picture

Figure 2 Pictures in the conversion

Figure 3 Second Picture

Because it is dynamic conversion, the above is just three pictures I caught, I can only help you understand the conversion process, the real effect is only waiting for you to do it in the way I can do it. Like the Revertrans filter using the BlendTrans filter, you need to use the method of JavaScript to call it. We now use this effect as an example to see how to use the BlendTrans filter. First, you must prepare a few photos. Size picture.

Production Method:

1. Make a BlendTrans filter with an old way (the previous article has been introduced) to make a BlendTrans filter, name "Myblen", Duration is set to "3" (ie, the conversion time is 3 seconds), the filter is set, The and of the page source code will have the following code: