使用WebGL实现的物理学热变形动画特效 - 酷热的非洲大陆

Animated Heat Distortion Effects with WebGL 一个关于如何在WebGL使用片段着色器（fragment shader）创建物理学热霾失真（热变形）的特效。

webgl，物理

《three.js使用多个渐变torus模拟光环光晕》申请公开！

第三方库
作品简介 2095
使用帮助
常用链接

HTML
CSS
JavaScript
Result

编译

JavaScript

编译

CSS

HTML

<div class="demo-1">
    <div class="container">
        <div class="wrap">
            <div class="background">
                <canvas class="background__canvas"></canvas>
                <canvas class="background__title background__title--big"></canvas>
                <canvas class="background__title background__title--medium" data-breakpoint="1000"></canvas>
                <canvas class="background__title background__title--small" data-breakpoint="600"></canvas>
            </div>
            
            <nav class="dummynav">
                <span class="dummynav__item">Asia</span>
                <span class="dummynav__item dummynav__item--active">Africa</span>
                <span class="dummynav__item">North America</span>
                <span class="dummynav__item">South America</span>
                <span class="dummynav__item">Antarctica</span>
                <span class="dummynav__item">Europe</span>
                <span class="dummynav__item">Australia</span>
            </nav>
        </div>
    </div>
    
    <script src="/uploads/tympanus/HeatDistortionEffect/js/desert.js"></script>
</div>

Animated Heat Distortion Effects with WebGL 一个关于如何在WebGL使用片段着色器（fragment shader）创建物理学热霾失真（热变形）的特效。

webgl，物理

编辑器支持Emmet

快捷键

Animated Heat Distortion Effects with WebGL 一个关于如何在WebGL使用片段着色器（fragment shader）创建物理学热霾失真（热变形）的特效。

webgl，物理

编辑器支持Emmet

快捷键

语言：

语言：

导入代码模板：