js实现刮奖操作

2018年11月7日2019年1月10日火辣辣JS

支付宝经常支付完成，会出现一个刮奖的操作，这个需求在开发中也算比较常用的一个功能了。 1、原理：canvas与canvas的叠加刮奖成功就是一张背景图，在背景图上方覆盖的灰色的canvas作为第一个 […]

js截屏以及three.js场景截屏

2018年11月1日2019年4月27日火辣辣JS

做这个功能都是半个月之前的事情了，没想到一直耽误却一直都没有写下总结，尴尬。。。。。来来来，说正事在手机端截屏完全不需要前端动什么脑子，但是在网页上截屏就很头疼了，我这里介绍两种情形，针对普遍和某一 […]

JavaScript前端实用小函数

2018年10月8日火辣辣JS

主要是在前端开发中经常会用到又比较简单的函数小工具，比如判断应用端是手机还是pc，判断手机横屏还是竖屏，resize和scroll这种频繁触发函数的防抖节流，判断是微信还是QQ，判断IE浏览器版本做兼容等等

three.js性能优化-(持续更新)

2018年8月6日2019年8月22日火辣辣Three

three.js在使用的时候一些性能优化方式

three.js的masking场景遮罩

2018年7月22日火辣辣Three

新接到一个项目，让我做两个场景的遮罩，如下所示可以控制参数，动态显示被遮罩的场景大小。利用THREE.shaderPass自定义着色器写的，代码如下 [crayon-5d608996863e031 […]

利用npm启一个vue的项目

2018年6月8日2018年6月8日火辣辣vue

1、安装npm 这里有详细的node.js安装方法以及下载地址node.js安装安裝完成后，在命令行中输入npm –version，显示如下则安装成功 2、安装vue [crayon-5 […]

滑动到视频video时候，自动全屏播放

2018年4月25日2019年4月15日火辣辣JS

上一篇文章介绍了插件video.js,但在项目中网页很长，并且是在下面要求滑动到视频的时候，视频自动全屏循环播放，且去掉控制条放在第一层当背景视频，第二层加膜层，第三层加文字展示。 1、css样式难 […]

视频播放插件video.js–插件推荐3

2018年4月16日2018年6月8日火辣辣前端

HTML5支持媒体播放，如音频audio，视频video，但是默认样式比较丑，并且兼容性比较差，这里推荐一个视频插件video.js 1 页面引用视频资源 [crayon-5d60899686a6c4 […]

关于响应式框架BootStrap

2018年4月16日2018年6月8日火辣辣HTML

最近在做公司的官网，然后在有设计师的情况下，胆大不怕死的用了bootstrap框架，真的是改到我吐血！！！！慎用点：框架里面很多样式都是！import，这样自己的样式经常性的不起作用被覆盖；框架 […]

复制文字clipboard.js—插件推荐2

2018年3月27日2018年6月8日火辣辣前端

复制文字到剪切板 clipboard.js 是一个不依赖 Flash,将文本复制到剪贴板的插件，仅仅 2kb。官网：剪切板代码：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>剪切板</title>
		<script src="https://cdn.bootcss.com/clipboard.js/2.0.0/clipboard.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<div>
			火辣辣个人博客：
			<span id="webId">http://huolalaweb.com</span>
			<button id="btn">点击复制</button>
		</div>
		
		<script>
			//底部微信公共号复制
			var clipboard = new ClipboardJS('#btn', {//点击的按钮id
				target: function() {
					return document.querySelector('#webId');//需要被复制的内容id
				}
			});
			clipboard.on('success', function(e) {
				console.log(e);
			});
			clipboard.on('error', function(e) {
				console.log(e);
			});
		</script>
	</body>
</html>

<!DOCTYPE html>

<html>

<head>

</head>

<body>

<div>

火辣辣个人博客：

<span id="webId">http://huolalaweb.com</span>

</div>

//底部微信公共号复制

var clipboard = new ClipboardJS('#btn', {//点击的按钮id

target: function() {

return document.querySelector('#webId');//需要被复制的内容id

}

});

clipboard.on('success', function(e) {

console.log(e);

});

clipboard.on('error', function(e) {

console.log(e);

});

</script>

</body>

</html>

欢 […]

火辣辣

前端博客

作者：火辣辣