00:00
好,那事件就是讲完之后,我们再来讲一遍什么呢?常见的问题啊,那明天咱们就要把这个滑屏实例给它做了啊,做这个滑屏实力的时候,我们会去封装一个全的库啊,那这个封装是蛮近之前对这个C3的一个理解的,好OK。好,那这个滑屏写完咱们就开始直接写项目了啊,那这个滑屏是项目里面的一个部分嘛,单独拿出来先给他写一写嘛,那写完这个滑笔就开始写音乐台了啊,从头部到最终的完整版啊,做完这个做一个相册啊,做完相册之后给大家补两个基础点,一个叫多子事件,一个叫重力感应。啊摇一摇嘛,是不是经常微型摇一摇的同学的话,这个功能要听听好啊,重力感应,重力感应看好我们看这个常见问题。好常见问题啊,这个常见问题里面的话,我们来看一下吧,啊,常见问题的话,待会我就不敲了啊,带你们看一看就行,CTRLC4个常见问题。
01:09
请权位好,第一个禁止电话与邮箱啊,这是一个什么问题呢啊,我可以给你们先写个小东西,大家看看。好比如说我上面就来一个数字1383838438是不是OK,一般这种东西大概在我们移动端,我可能只是只是干嘛。啊,有什么东西没写?那标签没写吧,诶怎么都没写啊。这个行了吧。这个面标签啊,你们要手枪啊。刷一下,你看现在是不是好好的,可是一放到移动端的话,他肯定是可以点击的,而且一点是可以打电话的。
02:03
是不是移动的是移动的,是不是只要碰碰到数字的嘛,你点上去就是个电话是不是啊,可是我们说有时候你画页面的时候就会出现数字。这些数字你让用户一点出现个电话吗?本来有个数字你统计正好是110啊,用户快一点,正好就个码打过去了,那你说是不是得通啊,那是不是咱们得把这些东西给他禁止掉,OK,我们可以来看一下吧,啊这个反正有时间我们来看看啊。Contra。幺九二点幺六八点。7.39。好。我们可以看到。
03:08
学校好,我们来看一下啊,好。好,这是我们这个桌面啊,你看我刷一下,你看这个文本是不是好好的,你看在我们昆下你点的话怎么点都不会出任何东西吧,是吧,你看这边快张一点,看着我一点上去是不是是不让你去打了,这种体验不好,我说这就是个统计的数字是不?那怎么办?OK,那移动端有一个标签在这一块叫格式化标签,干嘛呢?他告诉你window email window就是这个格式,跟电话邮箱比较比较像的干嘛?你不要给我干嘛,来个高亮跳转。没讲好,我们可以来看看嘛,走你。好,M的标签有很多个,懂吗?OK,我们来看M的标签,就是头部的一些信息嘛,啊,来看一下这个什么好走你。
04:05
取消刷一下好,你看我再点有吗,就没有了,这个时候他在遇到跟什么。跑步重新算。好,这个时候他啊,这个时候你有了这个面的标签,他在遇到页面上面有文字啊,有数字相关的,或者说跟email比较像的,它就不会你点上去他就不会去跳转了。能不能讲他就把你存当成一个什么文本来使用吧,可是有些时候我说这个东西干嘛。我就想他是一个号码吧。是不是问题,现在你一进是干嘛全部禁掉了,那怎么办?比如说下面是给你一个报警电话的。是不是啊,OK,那怎么办?来个A标签是不是?那A标签里面好有个什么呢?大家看A标签里面叫什么telephone。
05:01
走,你你可以在A标签里面这个have里面去写什么跳过码懂吗?比如说这边干嘛110啊,比如说干嘛幺三,反正就这个号码呗,是吧,OK,我们来看一下。好,我刷一下,好,你看后面是不是又出来了,说明这是个电话,你一点可以打的吧。你看一点啊,你们别打啊,打了我不管,OK来看一下这个能不能讲好也是一样啊,比如说你这边有个什么。1305261216艾特qq.com是不是你说待会这边去发email的问题,你这边已经干嘛。进了吧,那怎么办好,再看这里面的吗?没有To Ctrl c好这里。CTRLV干嘛把这个标干嘛,CTRLC直接。贴进来好看一下。好刷一下,你看后面是不是有一个邮箱一点。
06:04
好,直接跳转到什么,大家看你看是不是跳转到他的邮箱列表,让你用什么邮箱去发。能理解吗?好,那这些都是浏览器的默认的一个什么功能啊,懂不懂,OK,好,那这是一个点,好我们再来看。好,这个能不能过,可以过吧,好,来看什么叫链接按钮高亮啊,这个题来看看。好,比如说就看这个DEMO吧,F12,好,我刷过来,嗯,比如说我们这个一般我们说是A标签的下划线,我们都会干嘛清掉吧,Tax decre,为什么为闹是不是好,清掉之后我们来看吧,啊,比如说这个把它做成A标签吧,这个干掉。好,我就要一个一标签。好,Javacr pd2号很好走,你好,再来个按钮。
07:02
好input吧是吧,给button好ID不给了,给个value啊,我是按钮,比如说按钮好CTRLL保存一下,我在这边一刷,大家看怎那么小。好,百分百吧。是不是你看我一点的时候,大家看它有没有一个背景。是不是有一个高亮的背景啊,有时候这个背景的话,我们干嘛不希望是这样,你看这上面一点的话,哎,按钮好像没有吧。按钮是不是没有是吧,你看这个上去明显是不是有一个背景啊,那怎么办。啊,A般身上还有个样式叫什么。呃,想想叫杠,呃不是要加外B全缀外BK-tap刚卡了,看到没有,你看我把他变成粉色。
08:00
来看一下A标签,这个时候它的背景是一个什么颜色?你点上去的时候,点的这一瞬间,大家看是不是粉的。能理解吗?你一般我们这个颜色不想要怎么办?RGBA把它搞成一个透明色。好,就不会有了,来看一下,刷一下,我点上去的时候没有,只是自己变了一遍,自己有颜色很正常。懂不懂?可是我不想有这个背景,高亮能理解吗?好,这是样式上的一个问题,这叫什么解决链接按钮高亮问题,懂不懂?好,这个好像没有高亮。是不是链接按钮啊,OK,好,这个点能不能过好,那OK后面还有个什么圆角啊,来看这个圆角,圆角有点过分。为什么说圆角部分?这是什么鬼?我的玻璃呢?不吃了。就。
09:00
好,其实你玻璃干掉,它也会自己给你加一个OK来看,现在我说有一个input是不是OK,比如说type等于button。啊,就是我们刚,我们刚是不是写过一个等于按钮。好,看一下这个按钮。刷一下在我这边好好的是不是,比如说我这个一铺的吧。并不的,我说你的外20吧,也是20P吧,是不是我让你来一个。是不是OK,比如说为什么移动端是不是最好写PX值啊,比如说那个5PX是不是来看一下走。呀,那么小啊,二十二四稍微有点小了吧,给个五十五十你就。你看是不是在哪有一个小小的圆角的,好看一下一部分。
10:02
好。呀,然后重新扫一扫。说下你们看过不过分过不过分,太远了吧,是不是,这是不是太太过分了,你看,哪怕我没有写一遍叫看L,我是没想好来看一下。我说一下,你说他过不过分,只要是应波的,是不是给你就给你整这么远,你希望这样吗?肯定不希望,怎么办?加一条样式,我只希望有五篇是。圆角吧,那怎么办?有条是叫什么?我想想叫parents,嗯,叫什么parents啊,我我我得看一眼,忘了we k干什么,Web k干什么。APP不为什么we闹啊,不要让你这个圆角渲染的太过分,好来看一下只你我再刷一下,大家有没有看到人家是不是只有五了,好,那这些样式是我们移动端经常去样式重置的时候要写上的。
11:18
理解吗?好,那再来看一个比较严重一点的问题,叫方。Birthday啊,这个问题触发条件极其苛刻,可是有时候你写代码写的太长了,很有可能就会被触发到,一旦触发到了这个birthday啊。大家看。我们现在是不是一个D啊,里面是不是批标签啊,都是些文字吧,看这个放在下,我给他设置了多少。是不是只有P来看一下走你。As。大家看我是不是明明写的是24PX啊,大家看最终渲染的时候这个方程为多少?ABCD1。
12:02
F方等于多少?49,为什么?啊,因为移动端有些浏览器它很智能,它它干嘛,它本身就知道你这个字干嘛,显示太小了嘛,它会自己给你放大。比你看我写的是不是24PX啊,最终他给我放放大到了50PX啊,他说我知道你待会肯定看不清楚,那我给你放大一下啊,这个放大咱们视频的时候是咱们自己做的,你说他恶不性啊,他自以为他干嘛帮你,帮你做一些事情是不是,可是你发现干嘛。你帮了倒忙嘛,是不是,那怎么办啊,一般我们加高度,比如说你给他加高度,高度等于200PX是吧?给这个元素加高度吗?你看立马回归正常了吧,可是加高度的话会对我的样式产生影响的呀,那一般不会让你们加高度,叫什么max hat走你一双,你看是不是就二次了。
13:02
能不能理解。OK。所以说,什么是方。是web k给移动端浏览器提供了一个特性,当我们在手机上浏览网页时,很有可能因为原始页面宽度比较大,在手机屏幕上缩小后就看不清其中的文字了。而方的八特性在这时会自动将其中的文字字体变啊大,保证不需要你左右滑动,也不需要双击放大屏幕,你就可以阅读当中的文字啊,他其实想做好事情,懂不懂啊,只是帮了个倒忙,那放在八的计算规则极其复杂,这是他在C加加的,在他浏览器源码里面抠出来的,那跟什么有关系?跟大概跟你的屏幕尺寸有关系,跟什么?跟你原始的size有关系啊,还跟什么?啊,你看这是原始字体大小吧,经过计算后的字体大小换算系数,这是什么?这个是标的,跟标的有关系,跟你的缩放比例有关系啊,跟系统的字体大小有关系啊,跟什么,跟你这个应用的特性字体有关系,跟独立设备上说有关系啊,很复杂。
14:15
你别算我,我不要求你算,以后你写页面的时候,你发现你指定的方size比显示的要来的小,那肯定就是什么方被你触发了,这个时候怎么办?加马斯啊,给个999就行了,也不影响你的样式的。能解吗?这个时候的话就是这个字体就会恢复比较正常了,能没讲好,那这个方八是经常会遇到,一旦你页面画多了,或者说页面内容多了,就很容易触发到,懂吗?虽然说它的触发条件蛮苛刻的。你写DEMO,你是永远碰不到的。懂不懂我也不知道这个DEMO写了多少遍,说实话我都不知道我这个DEMO里面到底是什么东西触发了方八啊,因为这个DEMO很简单嘛,是不是?可是当我第二次在敲这个DEMO的时候,我发现触发不了。
15:04
啊,只有打开这个DEMO才会防呢,发现这个现象啊,很诡异啊,我也不知道为什么。啊,反正你们知道以后字体跟你预期的不一样,就给我加ma t就可以了,有没理解好,那移动端基础到这边全部整完好,明天开始我们写下啊OK。
我来说两句