Toggle navigation
在线编辑器
在线代码
文本比较
jQuery下载
前端库
在线手册
登录/注册
下载代码
html
css
js
分享到微信朋友圈
X
html
css
body { margin:0; } canvas { position: fixed; }
JavaScript
console.clear(); const twodWebGL = new WTCGL.default( document.querySelector('canvas#webgl'), document.querySelector('script#vertexShader').textContent, document.querySelector('script#fragmentShader').textContent); twodWebGL.startTime = -10000 + Math.random() * 5000; // twodWebGL.addUniform('xscale', WTCGL.TYPE_FLOAT, 0.5); window.addEventListener('resize', () => { twodWebGL.resize(window.innerWidth, window.innerHeight); }); twodWebGL.resize(window.innerWidth, window.innerHeight); twodWebGL.pxratio = window.devicePixelRatio; // track mouse move let mousepos = [0, 0]; const u_mousepos = twodWebGL.addUniform('mouse', WTCGL.TYPE_V2, mousepos); window.addEventListener('pointermove', e => { let ratio = window.innerHeight / window.innerWidth; if (window.innerHeight > window.innerWidth) { mousepos[0] = (e.pageX - window.innerWidth / 2) / window.innerWidth; mousepos[1] = (e.pageY - window.innerHeight / 2) / window.innerHeight * -1 * ratio; } else { mousepos[0] = (e.pageX - window.innerWidth / 2) / window.innerWidth / ratio; mousepos[1] = (e.pageY - window.innerHeight / 2) / window.innerHeight * -1; } twodWebGL.addUniform('mouse', WTCGL.TYPE_V2, mousepos); }); // Load all our textures. We only initiate the instance once all images are loaded. const textures = [ { name: 'noise', url: 'https://s3-us-west-2.amazonaws.com/s.cdpn.io/982762/noise.png', type: WTCGL.IMAGETYPE_TILE, img: null }]; const loadImage = function (imageObject) { let img = document.createElement('img'); img.crossOrigin = "anonymous"; return new Promise((resolve, reject) => { img.addEventListener('load', e => { imageObject.img = img; resolve(imageObject); }); img.addEventListener('error', e => { reject(e); }); img.src = imageObject.url; }); }; const loadTextures = function (textures) { return new Promise((resolve, reject) => { const loadTexture = pointer => { if (pointer >= textures.length || pointer > 10) { resolve(textures); return; }; const imageObject = textures[pointer]; const p = loadImage(imageObject); p.then( result => { twodWebGL.addTexture(result.name, result.type, result.img); }, error => { console.log('error', error); }).finally(e => { loadTexture(pointer + 1); }); }; loadTexture(0); }); }; loadTextures(textures).then( result => { twodWebGL.initTextures(); // twodWebGL.render(); twodWebGL.running = true; }, error => { console.log('error'); });
粒子
时间
文字
hover
canvas
3d
游戏
音乐
火焰
水波
轮播图
鼠标跟随
动画
css
加载动画
导航
菜单
按钮
滑块
tab
弹出层
统计图
svg
×
Close
在线代码下载提示
开通在线代码永久免费下载,需支付20jQ币
开通后,在线代码模块中所有代码可终身免费下!
您已开通在线代码永久免费下载,关闭提示框后,点下载代码可直接下载!
您已经开通过在线代码永久免费下载
对不起,您的jQ币不足!可通过发布资源 或
直接充值获取jQ币
取消
开通下载
<!doctype html> <html> <head> <meta charset="utf-8"> <title>上帝之眼-jq22.com</title> <script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script> <style>
</style> </head> <body>
<script>
</script>
</body> </html>
2012-2021 jQuery插件库版权所有
jquery插件
|
jq22工具库
|
网页技术
|
广告合作
|
在线反馈
|
版权声明
沪ICP备13043785号-1
浙公网安备 33041102000314号