ps切片使用

9-11日总结
1.切片工具将图片切分，按住shift则切片取整
2.切片选择工具选择需要保存的切片 ,需要点基于。。切片才能切好
3.按住shift+ctrl+alt+s保存，保存后选择图片存储类型，点击存储后选择切片，设置保存的图片的多少。

git使用
1.创建项目
2.powershell上进入指定文件夹克隆，克隆后进入项目文件夹f2e -i进行初始化。
初始化后用code打开。
git add .存到存储区 ；git commit -m “进一步提交”；git push提交到本地仓库 ；如果在仓库里有人改动，则git pull拉取下来。再push提交上去。
如果是克隆别人的项目，则克隆后 npm install npm run dev
在一个div里的图片如果需要用户保存，则将其嵌入到img标签里面，如果不需要保存，则将图片放入到背景图片里面。
通常情况下图片的底部有个白边，要想取消白边，则对图片设置display：block
项目打包:push完npm run build build后的打包文件在build大文件夹里，dev后缀文件，部署该文件即可

swiper轮滑和scroll
options：添加划条或者是点击左右按钮，同时在data里写上navigation或者scollbar，
所有滑动的那种效果都是放在swiper-slide里，swiper-slide下的div放左右按钮或者是滑条。swiper-slide里如果不放背景图片放img的话，则需要给图片设置高度，宽度可以自己有100%/
下面的原点表示轮滑顺序的点是paginition 需要自己写div

pc端需要在index.js里加一个code=“no”，且pc端用px，pc端可以设置一个div居中，在div里设置元素的定位可以适应屏幕的居中
嵌入直播 移动端：直接在video里写src，src为m3u8链接，
pc端：添加一个div，有class设置元素属性，id设置链接，netease链接放入mounted，不放也写方法，把方法写入mounted。括号内部最后为字符串id。

在和后台交互的时候，如果有ip接口地址，要放入config.url里。。config.url里如果有写好的前缀，注意接口的方法和名字。

加载多个图片的时候
shouye :require.context(’…/assets’,false,/shouye_(\d)/),
shouyeAssets:shouye.keys().map((item)=>{return shouye(item)}),
加载轮播图 1.npminstall 2.div 3.datali放options后面的数据 4.component里放组件

浮层弹窗
https://blog.csdn.net/baidu_41644405/article/details/90174995
在点击预约的时候没有弹窗是因为时间冒泡,在父元素中有this,isShow=false，所以会一直不出现，所以要取消冒泡事件

需要定时的，js获取当前时间戳
https://www.cnblogs.com/vaiyanzi/archive/2010/08/05/1792931.html

在部分区域吸顶灯效果
scrolltop,通常取得是相对于父元素的滚动高度,被屏幕遮住的那一部分,通常是相对于body,所以如果是父元素的子元素的子元素,要加上父元素的scrolltop才是该元素的滚动高度
offsettop 是子元素相对于父元素顶部的距离,通常来说是固定的, 但是要和scrolltop比,也是要加上父元素的offsettop
var ofT=document.getElementById(‘containwrap’)
var fixdom=document.getElementById(‘wrap’)
var ofTparent=document.getElementById(‘part8’)
var ofT9=document.getElementById(‘part9’)
window.addEventListener(‘scroll’,winscroll,false)
function winscroll(e){
let offsetT=ofTparent.offsetTop+ofT.offsetTop; //子元素的固定高度
let offsetT9=ofT9.offsetTop;
// console.log(offsetT);
let scrollT=window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop; 子元素的滚动距离…
console.log(scrollT);
if(scrollT>offsetT&&scrollT<offsetT9){ 都是相对于屏幕比较的 然后比较大小
fixdom.classList.add(‘fixed’);
}else{
fixdom.classList.remove(‘fixed’);
}
window.οnscrοll=function(){} //用来监听滚轮滚动事件，可以放在mounted里面。
实现轮播图的缩略图 https://blog.csdn.net/kassiaaaa/article/details/94636794

swiper学习笔记
https://www.jianshu.com/p/33824b920e8f
swiper3d
swiperOption2:{
effect : ‘coverflow’,
slidesPerView: 1, //关键是将轮播的设为1，并且最外层swiper设置为overflow:visible不为overhidden
centeredSlides: true,
coverflowEffect: {
rotate: 0,
stretch: 90,
depth: 60,
modifier: 2,
slideShadows : true
},
pagination:{
el:’.swiper-pagination2’
},
navigation: {
nextEl: ‘.swiper-button-next2’,
prevEl: ‘.swiper-button-prev2’
},

关于swiper回调index,dfinspire项目