vue 監聽屏幕變化

1、防抖

npm install lodash.debounce -save-dev

2、在main.js寫上如下代碼

const windowResize = function() {
	console.log("resize");
	var html = document.getElementsByTagName('html')[0];
	/*取到屏幕的寬度*/
	var width = window.innerWidth;
	/* 640 100  320 50 */
	var fontSize = 100 / 750 * width;
	/*設置fontsize*/
	html.style.fontSize = fontSize + 'px';
	window.onresize = function() {
		var html = document.getElementsByTagName('html')[0];
		/*取到屏幕的寬度*/
		var width = window.innerWidth;
		/* 640 100  320 50 */
		var fontSize = 100 / 750 * width;
		/*設置fontsize*/
		html.style.fontSize = fontSize + 'px';
	}
};

windowResize();
window.onresize = debounce(windowResize, 200);

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章