仿写淘宝首页

github地址：https://github.com/Paradoxical-whimsy/tb
根据淘宝首页的视觉效果仿写，大概花了一个月的时间。下面展示一些细节。

1号框的位置是搜索栏。左边的放大镜是图片，使用backgroundposition调整位置。照相机图片覆盖了获取文件的input标签，设置点击图片事件去点击input标签。搜索栏上的三个标签对它们的容器添加事件监听器去监听点击的标签id，根据id切换样式。
2号框的位置用了水平轮播图片代码去实现。
下面是搜索栏部分js代码。

//搜索栏
let labels = document.querySelectorAll('.label');
let search_input = document.querySelector('#search-input');
let search_file_img = document.querySelector('#search-file-img');
let search_file = document.querySelector('#search-file');
let search_recommands = document.querySelector('#search-recommands');
document.querySelector('#labels').addEventListener('click', function (e) {
   
	switch (e.target.id) {
   
		case 'baobei':
			search_input.setAttribute('placeholder', '      omi欧米女包');
			search_file_img.style.visibility = 'visible';
			search_recommands.style.display = 'flex';
			break;
		case 'tianmao':
			search_input.setAttribute('placeholder', '');
			search_file_img.style.visibility = 'hidden';
			search_recommands.style