00:00
咱们是把这个电视器的应用，这个主要是定义这么一个木函数啊，很简单的一个木函数，那这个呢，以后我们会有一些更强大的方法啊，那现在我们暂时用这个就够用了，那有了这个函数以后呢，我们可以做一些这种简单的一些这个效果出来了啊，简单的功能出来了，比如说由于什么呢，比如说我这块有一个练习这个。然后用我们这个火狐给打开，哎，是这么一个东西。对这个页面呢，比较简单，还是咱们那个什么呀，那五张图片是吧？诶它也是一个图片的一个这个自动切换的一个效果，但是呢，这个效果就比我们上午做那个，我们上午做那个切换的很很生硬是吧，咔咔咔咔直接就换了，但是这好像那个嘛了，它是它这样整个往这边转的是吧？诶那么一个个去转起来的，哎去切换的，那这个效果我们想想我们要怎么做，诶或者说先想想它这功能，它是它是怎么做到的，看这块能看出来吗？
01:00
就是你看到这个东西，你要先自己有一个这个猜测啊，你要先猜一下他是怎么做的啊，一定要干嘛呀，一定要像那个孙悟空火眼金睛一样，一眼就能看出他什么呀，本质啊，透过现象看本质，其实这是一个什么东西呀。哎，来咱们看看吧，这可不是一张图片是吧，这一张个太麻烦了啊，太麻烦了，来我这一选中，一选中它，我们首先看这页面结构，页面结构呢，最外边是一个这个div对吧？诶最外边是一个div div里边呢是一个这个u Lu l里边有一个div，这个div应该是我们这有一堆这个什么呀，小的导航按钮，它是不是有一一个在一个div里边啊，先不管它了，我们先看UL，我们会发现我这个所有的图片，Ul里边有ly Li里I里面放的什么呀图片，那实际上我所有图片是不是都在一个这个无序列表里啊，哎，无序列表里，那你看当我一选这个UR的时候，你看是不是整个一蓝一大块啊，那证明我这个ul整个实际上来说是不是挺大的呀，哎，挺大的，而我们这div它只显示什么，是不是只显示中间那部分啊，哎，那我们再看啊，选出的div div有一个属性叫做overflow hidden什么玩意儿，是不是将溢出的内容给它裁剪了呀，那现在干嘛。
02:16
可能我选中它把这属性给它住了啊，给它取消掉易保存。诶，这就看出来了吗？这就没意思了是吧？哎，你会发现什么呀，实际上它就是把我们所有的图片摆成了什么呀，一横行对吧，然后呢。是在调整这个整个ul的这个偏移量啊，哎，我们来看这ul有没有调整，Ul在这儿呢？你看是不是一个life呀，520负520，这是一个，然后这是负1040，这来一个负的一个1560，你是不是随着这个偏移量调整，它是在切换这个图片啊，这样干嘛呢？我这个ul现在是一个什么情况，咱们可以来画一个简单的图来看一下什么情况呀。
03:01
我们整个div实际上可能稍微的小一点，可能也就是什么呢，也就这么大个啊，这么大个，然后在div里边我们有一个ul，这个ul可能稍微的短嘛呀，能稍微的缺长一点，这个ul里边是一堆的。图片对吧，然后整个这个ul一直是往往左转吧，诶转一个换一个，转一个换一个，转一个换一个，是不是这样就就转起来了，诶这样就把我们的图片都给它切换起来了，这样是不是达到这么一个轮播的一个效果呀，转一个换一个，转一个换一个，转一个换一个这么一个效果，那所以我们要做这个功能，我们现在干嘛呀。是不是先得把我这个整个页面的布局给它写出来呀，哎，整个页面布局给它写出来，来我们来一块写一下，那这个玩意儿怎么写呢？慢慢写，不着急啊，来先新建一个文件，来一个11，我们叫做一个这个什么呀，叫做一个轮播图，哎什么叫轮播图呢？它像一个轮子一样，是不是一直在在转呀，哎，轮播图那这个里边首先呢，我们来创建一个外部的一个div在这啊，我们来创建一个这个外部的这个div来作为什么呢？呃，来作为我们这个什么呀，诶一个大的一个容器，就是我所有内容都在这个div里来的div，我这来个井号，一个这个aler，我们就用ID了，说点事叫做一个aler，然后这个div就相当于我外边这个大的这这块吧，在div里我需要放的什么呀？
04:29
Ul吧，哎，无序列表啊，无序列表在这儿呢，我来创建一个ul，创建一个ul用于什么呢？用于放置我们这个什么呀？哎，放置我们这个图片啊，图片直接来一个ulul，给它来一个ID，我们叫做一个IG list图片的一个列表在UI里边呢，我来放这些Li l里边我再放一个什么呀，MG啊MG我来一个1.gbd给它来一个二，咱们先不写啊，咱正常来开发，正常来说开发的中间给它写上啊写我这不写了，好，那现在我这一共是不是五个图片啊，五个图片就是有五个LY2345，当然这个名不能一样，2.gbd 3.gbd 4.gbd 5.gd，是不是这样一个结构啊，保存我这CTRL运行，诶是不就出来了，诶，但是你会发现这俩好像。
05:24
一样的是吧，诶差别是不是有点大呀？诶咱别着急，咱们需要慢慢的去设置这个样式啊，慢慢的设置样式，首先呢，怎么说了，整个div它实际上是应该有一个宽度的，它不是不是全屏的吧？诶它是有一个宽度的，我们先来设置它这个宽度，那我们来看这宽度是多少合适啊，我们来看看这图片，那在这儿我们先一边写一边一边整吧，直接来一个带哦标签。这LY写的稍微有点难看，我们这样吧，给它写成写成一行啊，写成一行咱们稍微省点空间，这样看的清楚一点，这是一个23455个图片啊，然后在上边我们来设置样式，先来什么呢？要来一个星号，然后来一个MARIN0，然后来一个这个拍ING0，我是不是先把这个默认的外边距，还有这个那边距给它去掉，然后来设置我们这个外部这个div，设置我们这个al的这个样式，直接来一个井号aler aler呢，我们来看看那宽度设多少合适呢？宽度其实正常来讲，其实跟我们这个跟这图片宽度差不多，是不是行了呀，来打开我们看看图片，图片的大小呢，是一个500乘以一个332，看看别的500乘以333，诶就那一个是332，其他都是333是吧，那咱们就统一按照大的来，直接来一个500乘以333宽度，外来一个这个500个。
06:52
像素高度来个333个像素，是不是给它定出这个宽和高梁，诶这一块我们说设置我们这个宽和高，然后呢，我们让它是居中啊，诶居中居中怎么居来一个MAR0，然后来一个o two，这样一刷新，我们来看走你是不是整个居中来，当然位置可能还稍微的有点有点偏上是吧，偏上咱们让它往下来一点，往下来一点什么呢？来一个这个50个像素啊，往下来50个，这一刷新走你是不是就往下挪了呀？诶往下挪了以后呢，那再来看了，再来看咱们这样吧，我希望这上边是不是能给它设置一个背景颜色吧，给它设置一个背景颜色，这来设置背景颜色，背景颜色直接background color，来一个这个yellow yellow green啊yellow green这么一个颜色一刷新，但是颜色呢，它看不着吧，大家看不着啊，诶现在是不是被这个图片盖住了，诶被这个图片。
07:52
盖住了，那我这需要什么啊，给它上下加一个这个拍顶啊拍顶它出来左右我们就不加了，左右待会我们在这图片自己加啊左右我们先不加了，来一个这个拍顶，这是设置我们这个拍顶上下的拍顶直接来一个拍定来什么呢？十个像素左右呢，先不要啊左右先不要，我这一保存，然后一刷新左诶是不是出来了，诶这个颜色有点深啊，用到颜色应该是那个古润yellow是吧？古yellow哎，这个颜色是吧？这颜色我熟是吧？颜色我熟啊来那下边整完了这个玩意儿呢，还有什么问题，首先是不是该处理我ul了，Ul这大大痦子还在呢是吧？诶这东西我们是给他去了呀，诶怎么去啊？诶，List磁带来设置我们这个img这个list直接来一个井号img list我们来什么呢？先来去。
08:52
图我们这个项目符号，项目符号直接来一个这个list的style来一个，那这块一刷新走，你点是没了呀，点这没了，然后呢，这哥们儿是不是还竖着呢呀，你你这你这竖着你只能上下转是吧？但是我们这是什么呀，左右转是不是得先让这个图片横过来呀，那怎么让图片横过来，先说它为什么会竖着啊，是不是因为我这是Li啊，你既然是Li了，它肯定是它是块元素，是不是肯定是竖着排列啊，那我需要横着，我是不是Li浮动啊，诶让我们这个Li向左浮动来这来干嘛呢？设置我们图片中的这个LY，直接来一个井号mg list下边这个LA来一个float，来一个这个left是不是向左浮动啊，浮动来横过来横。
09:49
横你咋不横啊，这浮动怎么都不管用了是吧？我觉得浮动是万能的，浮动都浮动过来了，为啥呀？哎，那现在我们给没给ul设置宽度啊。
10:05
没有吧，没有设置UI，设置宽度，那它的宽度是不是应该差负元素的100%啊，负元素多宽呀，负元素才500，我U500啊，也就是说我现在整个点开下了啊，也就是说现在我整个ul就这么宽，你边上还有地儿摆吗？没有地儿摆了吧，所以如果你希望能横过来，那你是不是还得把这个宽度调整一下啊，那宽度应该多少啊，一张图片是500，我一共有五张图片，那宽度最少最少你也得两千五吧，诶两千五啊，所以这块我们来设置一下我们这个ul的一个宽度。来设置我们这个ul的一个宽度，直接来一个叫做一个Y来什么呢？2000诶2500个像素，因为五张图片，一张图片是500，我这一保存，然后一刷新走你诶这回是不是就横过来了，诶就横过来了啊好横过来是横过来了，但是感觉这图片有点太近了是吧，不过也还好是吧，也还好，但是现在我们想它干嘛呢？显的稍微的宽敞一点，也就说你两个之间是不是有点距离啊，那这块咋整啊？哎，是不是给它加一个左右的一个外边距啊哎，外边距给谁设置啊？哎给Li吧，诶给Li啊这块我们来写个注释，这也是我们说设置我们这个浮动，现在很多同学看这玩意儿已经很陌生了，是吧，感觉好像都不认识了是吧？嗯，接下来呢，我们就来设置我们这个左右外边距上下就不用设置了，直接来一个左右来一个margin，上下是零，左右来一个什么呀，十个像素这样一保存一刷新走你诶是不是就开了。
11:45
看又下去了，哎，刚才我是没有设置外边距吧，没有设置外边距一个是500，那现在我左边设置一个十个像素边距，右边又设置了一个十个像素，变成多少了，变成五百二了吧，成520，你这是不是就不够宽了呀，于是是不是又下去了，诶又下去了，那加了二十一共五个图片，是不是整个加了100啊，诶应该改成一个两千六啊两千六来，我这一刷新走你我就横过来了，哎，当时有问题啊，这现在2600，那假如说我可能图片我又多了一张呢，怎么办？是不又下去了，诶又下去了啊，所以这写死了不好，待会我们来说怎么办，先给它空着，记住这有一个小问题，写死了不好啊，写死了不好，然后再看还有什么问题啊，这div是不是也不够宽了，Div是怎么还怎么还拐弯了呀？开始我设置div的宽度是多少，500，因为我开始假设图片的宽度。
12:46
是500对吧，但是现在我这左右各加了十个像素，我图片的宽度实际上变成了五百二了，所以div是不是容不下它了，诶那这块应该完调整，我们div的宽度是五百二吧，哎，520像素这样一保存走你是不是正合适啊，哎，这么一个效果，这样五张图片是不是就横过来了，哎，就横过来了啊好，那这块看完了，然后我们来解决，咱们把刚才那问题解决一下吧，刚才这个问题我们这块是一个两千六给它写死了，我们说写死了不好，为什么不好呢？现在我是五张图片，如果我多了一张是不是换行了呀，如果我少了一张是不是就就空一块啊，哎，就空一块，所以现在我希望什么呢？这个值可以根据我这个图片的数量是不是自动去修改啊，那怎么办呀。
13:33
诶，我们是不是可以通过我们这个加va script截S来设置，诶接下来设置来一个script的标签，那现在呢，我把这个宽度啊，我先给它。去掉现在是不是没宽度了，一保存咱们来看是不是换过来了，哎，换过了啊，然后干嘛呢？我在这写一个window，点一个onload，等于一个这个function方程干嘛呢？在这我们来设置我们这个img list的什么呀，宽度啊，宽度宽度怎么设置啊，那首先我先来干嘛呀，对，先来获取吧，哎，获取我们这个img list，它直接有个ID直接就来了Y一个img list等于一个document，点一个get element版ID来一个这个什么呀？IG list是不是就获取到这个ul了，那这宽度应该是多少？
14:29
诶，如果有五张图片，我就应该是五百二乘以五，如果有十张图片，是不是应该五百二乘以十啊，那这十这五应该是谁呀？是不是有几个图片啊？诶，那我能不能获取所有的图片？诶获取我们页面中所有的图片，其实就是什么呀，所有的img标签吧，直接来一个Y，一个MGR瑞数组等于什么呢？Document点一个get ls by tag name，来一个MG，这是不是就所有的MG标签啊？诶然后在这来设置它的宽度，它的宽度应该怎么设置呢？直接来一个IG list，点一个style，点一个Y应该等于什么呀？等于我们的哎，520乘以谁呀？MG，呃，瑞点一个lengths，诶，乘以你的长度，如果你有五个等于五，如果有十个就乘以十，但是光这么写行不行？诶，不要忘了，还有那个PX这一保存，再看一刷新是不是横过来了，好处在哪？
15:30
图片多了是自动长啊，诶自动长，图片少了是不是自动减呀，诶自动减，这样我们就不用去考虑这个图片的数量，它会自动根据你的这个需要去设置这个宽度啊，设置宽度好，那这个结构我们就搭出来了啊，把这块给它调整一下，那这块出来了，然后再看，那现在我们说怎么去切换图片啊，现在这是我们div整个ul它是这么大个，那我要想移动它，我是不是整个把这个ul整个往往左移啊，那往左移，那我是不是给ul得开启。
16:04
定位啊，哎，我得开启一个绝定位啊，那这里边我们来给ul开启一个这个绝对定位，开启我们这个绝对定位，直接来一个这个position position来一个a salut，但是你这开启绝对定位，现在它是相对于谁定位窗口吧，哎，我们说了你给子元素开启绝对定位，最好同时给负元素开启相对定位了，哎，所以我们给负元素，也就是我们这个al，这个div开启一个这个相对定位，直接来一个position position，我们来一个DRY了T，这样ul是不是相对于这个al去定位了呀？诶这个大家看看没有任何变化，因为我没有设置偏移量吧。好，那现在我假设希望什么呢？我希望显示下一张图片，我是不是把整个ul向左移啊，那你要向左移，我要改变的是什么？是不是left呀？设置我们这个偏移量来一个left left等于零，这是一个默认值。
17:04
啊，默认值我这一刷新没有变化对吧，那我要向左移，我是不是得是负值啊，来一个，比如说来一个这个负100，负100，我这一保存一刷新是不是向左移了呀，但是问题来了，这玩意儿也不对，是不是移到了两张图片之间了呀，我想是不是正好显示第二个图片啊，那我得移多少？诶我是不是应该移这么一个大小啊，这个大小其实就是我们这个一个LY的宽度，那其实就是什么呀，520，所以我应该移的一个是负五百二啊五百二我来一保存走，你是不是第二张啊，我要显示第三张呢，是不是再移一个五百二啊，诶整体就是负的10401保存，这就刷新是不是又切换到下一张了，诶切到下一张了，所以这块我们说诶每诶向左一动，520个这个像素就什么呢，就会显示到什么呀，诶下一张。
18:03
图片移几个就显示几个，移一个就显示下一张，移两个就显示下两张，移三个就显示下三张啊，以此类推，就不多说了啊，但是这又带来一个问题，你这完了，我其实这效果也还挺好是吧，还能看见上一张，还能看见下一张，但是我们希望只能看见什么呀，是不是当前这个呀，这个这个通通是不是不要啊，那怎么办呀？哎，这是不是都属于这个溢出的内容啊，那你要不想看把溢出内容给它剪了是不是行了，哎，咱们来一剪没是吧，这得两剪子，这边一剪子，这边还得一剪子，但是对于咱们来说就是一个属性来，我们叫什么呢？诶，裁剪我们这个什么呀，溢出的这个内容怎么裁剪呀，Overfflow overflow，来一个黑的一保存，咱们一刷新走，你不就剩这一个了，诶你说我想显示，诶显示下一张再加一个五百二是一个1560，诶15601刷新是不是下一张了呀，你说我还想显示第一张，直接来一什么呀，来一个零已保存是不是回到第一张了？诶所以现在可以通过这个ul的偏移量来设置我们这个要显示这个图片啊这么一个结构就给它搭完了，搭完了以后来看看还差什么东西，是不是小点的呀？哎，有这个小点，这个导航点是吧？诶导航点这东西怎么办？首先说它是不是可以点的呀，这样它是有什么呀，是不是就是超链接呀？哎，就来整一个超链接就完事了啊，超链接完事了，所以在我们最下边在哪呢？在这个ul下边我们来。
19:44
创建我们这个导航按钮，创建我们这个导航按钮，直接来一个什么呢？来一个div吧，Div，然后呢，给它来一个ID，我们叫一个NAV这个div，导航这个div，然后呢，在这里边我们来放这个超链接，应该放几个超链接啊，五个吧，因为有五个图片，一个超链接是不是对应一个图片啊，哎，放五个超链接，直接来一个A，然后h drive Java script SCI I PT，冒号分号五个超链接，这超链接里边呢，我们什么也不写啊，不设置这个文字了，因为你设置文字也没用，我们是需要让它显示这么一个红色小方块吧，诶现在我一保存呢，咱们在这儿呢，其实会发现什么呀，什么也看不着，因为这div这个我们是不是没有设置了呀，还没有设置呢啊来，那咱们这里边呢，咱们写点字吧，未来他出来写一写俩一刷新走，你是不是跟这儿呢呀，哎跟这呢，哎，他怎么跑上面去了。
20:38
这一绝对定位他们它是不是脱离文档流了，脱离文档流那个元素是不是就拱上去了，哎拱上去，而且还是什么呀，而且我们说这图片把我们的链接是不是给给盖上了，给盖上了，那我们想想我这超链接应是不是应该在图片的这个上边啊，而且我们想想我这个导航按钮，我用不用给它定位啊。
21:00
是不是也得定位啊，你也得定位到这个下边对吧，所以这块呢，整个这个div我们也需要给它开启什么呀，绝对定位啊绝对定位来找到上边我们来设置我们这个导航按钮，设置我们这个导航按钮，首先呢，第一个是我们这个NAV的这个什么呀，井号NAV的这个div直接导航按钮，我来什么呢？来一个先第一件事就是开启它的这个绝对定位，直接来一个position，来一个阿巴SALUTE1保存，咱们这回再看这块一刷新走，你这A是不是上来了，为什么这回跑上面来了。它也开启决定位了，它也开启定位了，但是它是它下边这个兄弟元素，所以它是不会在它上面显示啊，哎，后边的在上边下边这个上边这个上边显示啊，它会在优先显示啊，先显示好，那这块显示完了，那你就显示A不合适是吧，我们要显示一个大小，所以这里边呢，接着来设置井号NAV下边div的下边是什么呀？下边的A，我来给他设置一个外来一个十个像素，Has也来一个这个十个像素，但是我现在问你，我这么设置管不管用，为啥呀？内像素吧，设置完了一点用也没有，不会起作用的内联像素这个什么呀，宽高不起作用啊，不起作用那怎么办呀，我说变成抗元素啊，但是变成抗元素也会有个问题，第一次play，来一个block变成抗元素吧，一刷新走，你是不是竖着呢呀，哎，竖着呢啊，咱们来一个背景颜色吧。
22:34
在这来一个back color，来个这个red，我一保存，咱们一刷新走你诶是不是竖过来了呀，而我们希望还是什么呀，横过来，横过来怎么办呢？航天抗生素也行，但是航天抗生素还记得有那么一问题，他俩之间是不是有空白啊，这空白是不是会给你显示出来呀？哎，而我不想这个空白，因为有那空白我们就不好算了，所以其实还是最简单的干嘛呢？直接让他浮动，浮动以后向左浮动以后它干嘛了？首先浮动以后是不是横着排列啊，然后浮动以后拖两杠流块元素是不是也会变成是内联元素，是不是变成快元素，诶变成快元素啊这块现在呢，想不起来的，赶紧去回顾一下啊，设置我们这个超链接浮动，然后这是设置我们这个超链接的宽高啊，设置超链接的这个宽和高，然后呢，这是设置我们这个背景颜色啊，设置背景颜色这一块再来看易刷新，这回是不是就横过来了，诶那这AA是不是就可以。
23:34
不要了呀，诶AA就可以不要了啊把这AA呢给它去掉，去掉就这么一个红色，但是感觉好像这块有点有点小是吧？哎，有点小，咱们再加点吧，来一个十五十五乘以十五一保存，这一刷新走紧诶是不是稍微快一点的诶但是怎么连成一条了呀，诶没有距离吧，哎没有距离再给他们设置一个这个左右外边距，左右外边距来一个这个marin上下不要左右来一个五个像素，这下一刷新走，你是不是就撑开来，诶撑开了以后呢，这红色吧，有点哎有点戳眼睛是吧？哎，我们希望像我们这样有点什么呀，透明那种效果是吧，有点半透明这种效果，那所以这块呢，我直接来一个设置一个这个透明，透明怎么设置啊al city来一个零点。
24:34
五半透明，然后这一刷新，瞅你啊不CT也忘了是吧，诶是不是这么一个效果呀，但注意有啥问题啊，哎，咱们看看我们这个肯定没问题，没问题吧，但是我们谁呀？哎，我们这个，哎我们这IE呦呵，图片什么都出来了喂，为啥？
25:00
哎，中文名啊，文件名中文给它拖进来就OK了啊，拖进来OK了，然后呢，IE11是支持的，但是我们这个IEIE8是不是不灵了呀，哎，所以我们还得去兼容IE8的透明，兼容我们这个IE8透明怎么写的呀，叫做一个filter啊filter冒号alha阿尔法阿尔法透明我们这里边是一个op，等于一个50，这样一保存一刷新走你是不就OK了呀？诶这个颜色就OK了啊给它关上了，其他就没有问题了，好，那这块看完了，然后接下来呢，接下来该干嘛了，这位置是不是不对了呀，这哥们儿，我们是不是得让他往往下呀，往下还得居中是吧？诶居中那我么就需要调整位置，给我们整个这个div是不是去定位啊，诶定位来设置我们这个位置，设置我们这个位置，先设下边的来一个这个包。
26:00
Op包他们来一个00PX是不是沉到底了呀，来沉到底了，这一刷新是不到底了呀，那感觉有点太高下了是吧呀，太高下了，来调一个来一个这个十五一刷新，诶是不是就合适了，哎，就合适了，诶这块好整了，然后还需要干嘛呀，居中吧，哎，我需要让这个整个在这儿去居中，那这块居中吧，还有点麻烦，诶麻烦在哪？我们得算一下，怎么去算呢？首先来看我们现在希望这个div是不是在整个这个负元素水平居中啊，哎，负元素水平居中，那这块我要怎么办呢？那现在我们来看整个这个div它自身是不是有一个宽度啊，负元素是不是有一个宽度啊，它们两个之间是是有一个差呀，差是谁呀？是不是就这段距离啊？哎，这段距离，那我怎么让它居中啊？求出这段距离，我让这段距离除以二是不是剩一半啊？左边这么远，右边这么远，它是不是正好就？
27:00
居中了呀，哎，正好居中了，所以我要干嘛呀，我要先求出它们两个差的。两两个距离，两个宽度的一个差吧，哎，两个宽度差，那这块怎么求啊，这大div的宽度知不知道五百二吧？哎，五百二啊，我们来算一下啊，算一下这left的值，设置我们这个life的值，我们需要让它居中，我们需要算一下我们这个al这个什么呀，Aler这个宽度宽度是一个520，然后呢，我们这个NAV这个divv div宽度多少呢？它宽度多少啊，它宽度是由子元素撑开的是吧？它子元素我们看A就是AA的宽度是15，但是注意还有左右外边距吧，左右外边距加一块，左边五个，右边五个加一块是不是十啊，十加15总共宽度是25，一共有几个呀。一共五个吧，一共有五个，所以这块是五乘以15是诶五乘以25是吧？25乘以一个五等于一个五五二十五二五一百二十五是吧？诶125，然后我们这需要干嘛呀？五百二减去一个125等于多少？
28:21
咱们把他请出来吧，呃，五百二减去一个125N的时候，你都算算是吧，等于一个395 395再来什么呢？除以二等于一个什么呀，197.5 197.5，那现在就是它们之间这个距离差的一个1/2吧，那怎么办呀，我让它的leftft值等于197是不是就OK了呀？诶left值等于197.5就行了啊，Leftft来一个什么呀，197就就完事，差那点五也看不出来啊，197PX这一保存，咱们再看一刷新是不是就居中了呀？哎，就居中了啊这么一个效果，但是这玩意儿你一看我这招有点有点笨是吧？笨不怕啊，笨不怕怕什么呢？
29:15
再来一个，我是又多了一个呀，一刷新走你完了是不是不居中了呀？哎，他在哪呢？是不是又写死了呀？哎，我们希望是不是动态的去设置啊，我少这种情况，我少一个它就不集中了，多一个是不是也不居中了呀，所以最好怎么办，是不是通过我们这个GS去设置啊，哎，所以这块我们不采用这种方式啊，但是你要知道我们原理，你用GS设置也是这一套啊，也是这一套，我们来看怎么算，现在我一刷新是不是就不居中了呀？哎，不居中了啊来在GS这来写一下干嘛呢？设置我们这个导航。德鳌岛贺昂航导航按钮居中居中，怎么居中？我先来干嘛呢？先来获取获取我们这个img，这个div，我是不是它居中啊，直接挖一个IG div等于一个document点，一个get element100id来一个IGAMG点，不是MG点位，叫做一个NAV点位啊，写错名了n NAV点位。
30:20
获取到它了，然后还得干嘛呀，这是子元素是吧？我是不是还得获取它负元素啊，哎，获取我们这个alter啊，Alter挖一个这个alter等于一个document，点一个guide element100id来一个alter alter是不是也有了呀？那接下来干嘛呢？来设置我们这个NAV div d left值，怎么设置NAV divv点一个left，诶，点stylele啊，点style点一个left等于什么呢？首先我来一个aler，点一个offet。嗯。
31:01
诶，这是不是获取我们它那个宽度啊，咱们这块无所谓，因为我也没有边框，你用off size用呢都行啊，都行，咱们这块无所谓啊，Al点一个off set y，我是不是获取它的一个宽度啊，干嘛呢，再减去一个我们这个NAV divv点一个offet west，我是不是让它哪个。宽度做减法呀，得出一个差，然后那个差干嘛呀，整体让它是不是除以二啊，哎，除以二是不是就刚才咱们求那个值啊，再加上一个这个是不是就OK了呀？哎，就OK了啊，我这一保存咱们来看效果，这样一刷新走你是不是居中了呀？哎，就不用咱们自己再去摁计算机了，是吧？这玩意儿是不高级多了，而且还有什么好处啊，灵活，什么叫灵活呢？来我这现在十个按钮已保存，你放心。也居中啊，哎，我再来十个是不是还居中了呀？哎，所以他可以去了，你说我这少少五个一保存是不是也居中啊，诶更加的灵活啊，更加的灵活好，那这一块呢，是我们说的这个整个这个页面就算是基本给它完成了啊，待会来看有什么问题，首先呢，一上来这玩意儿。
32:17
一放上去时候没有效果呀，哎，一放上没有效果，所以这里边呢，来给它设置一个样式，怎么设置啊，设置我们这个鼠标移入的这个效果，直接来一个井号NAV div，前边A冒号一个什么呀，后边后边来一个这什么呢？Color来一个black黑色的一刷新一移入。是不是这个效果呀，哎，就这个效果了啊，然后还有一个什么问题呢？上来以后我默认是默认是第一张图片显示吧，但是那我既然默认是第一张图片显示，我应该是第一个超链接，是不是应该变成黑色呀？诶那这块怎么办呢？你可以给它加一个class，但是我们说这种方式不好，因为你改的时候要麻烦，那我们还是干嘛呢？通过我们GS设置啊，通过GS设置怎么设置来在这过来，那现在你要设置第一个A，那我先干嘛呢？我先来这么一件事干嘛呢？获取所有的A啊获取所有的A，直接挖一个这个AAOA所有的A，所有的这个，诶等于一个这个的点一个摆tIgEr个来一个A，这是所有的所有的A都有了，然后干嘛呢？我来还得有一个，你不仅仅有所有A，你还得有什么呀，诶，我们这个有一个默认显示图片的那个什么呀。
33:44
啊，索引吧，诶你得有一个默认的索引，直接Y一个index，因为我们默认显示是第一张吧，所以就来一什么呀，零啊就来一个零，然后呢，我们来设置什么呀，设置我们这个默认选中的这个效果，怎么设置呢？直接OA所有的A，然后中号来一个这个index.sta点一个什么呢？哎，点一个back ground color等于一个black，那这样什么效果呀，这样上来我是不是把第一个A就给设置成黑色了，诶你一保存一刷新是不是黑色了，那你说如果我显示第二张呢，你这设置成一一刷新是第二遍黑色了，诶可以根据这个index来设置那个选中啊，还是让它默认为零好了，那整个咱们这个页面就算给他整完了啊，整完了但是功能还没做呢，是吧，其实把页面整完了，功能完成了已经一一大半了啊，功能就好做了，页面做起来有点麻烦有麻烦。
34:44
来，我们来听一下。
我来说两句