Created
October 12, 2016 19:41
-
-
Save llliiu/ca26b8a3ad35bcc16228acf921eab008 to your computer and use it in GitHub Desktop.
Gradient Canvas
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<script type="text/javascript" src="https://rawgit.com/patriciogonzalezvivo/glslCanvas/master/build/GlslCanvas.js"></script> | |
<body> | |
<canvas class="glslCanvas" data-fragment=" | |
// Author: Lu Liu | |
// Title: 200C HW1 | |
#ifdef GL_ES | |
precision mediump float; | |
#endif | |
uniform vec2 u_resolution; | |
uniform vec2 u_mouse; | |
uniform float u_time; | |
void main() { | |
vec2 st = gl_FragCoord.xy/u_resolution.xy; | |
float redc = st.x * abs(sin(u_time/2.)); | |
float greenc = st.y * abs(cos(u_time/2.)); | |
float pct; | |
if(st.x<=u_resolution.x/2.) | |
{pct = .6;} | |
if(st.x>=u_resolution.x/2.) | |
{pct = 1.;} | |
vec3 color= vec3(redc*pct,greenc*pct,(u_mouse.x/u_resolution.x)*pct); | |
gl_FragColor = vec4(color,1.0); | |
} | |
" | |
width="600" height="600"> </canvas> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment