30.尚硅谷_jQuery_循环翻页.avi原创

呃，现在是想做什么？叫无限循环切换，说白了就是第一页的上一页是谁，最后一页最后一页的下一页是谁。第一页。我们要想实验室的效果，首先得去改布局啊，首先得去改布局，看到我的这个image是吧，我要在这个里面。在这个一的上面其实加的是哪个image JPG 5JPG是不是好，接着在五的下面实际上加的是一写笔记。够了吗？还不够。改样式。还得改样子。哪个样式啊，这个你现在整个图片是不是真宽了呀，你要就300的话，是不是有些同学看不见了，怎么办？改成多少六六百乘以几七对吧啊有个你特别有意思的是有个吧，六七四十八。

啊。是不是4200像素啊，没问题吧，还有一个事情，这样的话，第一页看到的是谁。嗯，第一页看到的是哪个图片，一上来看到哪个图片了，第五张图片了。能不懂，其实啊，应该是这张图片才对。对不对，这是我的第一张图片啊，但是一上来的时候看到的第五张，那我应该怎么办呢？一上来给我加一个，加一个什么left等于多少呢？多少是不是要向左移动一点，移动600啊负什么600PX。

那我再一刷，就变成了你我的第一张图片对不对。对了吧，嗯，对了，好对了，以后下面我们就正常干活了。刚才我们说怎么样去能够去做到的了。大家看啊，这是我第一章第二章第三章第四章，好了，我马上就要翻到什么第五章，第五章那右边是第一张，但是我能停在这里吗？我要停在这里，左边就是空白了，对不对。

能懂吧，也就是说当我滑动到这个位置的时候，就当前这个位置。那我要瞬间刚刚说了，要跳到什么左边的什么，左边的第二张图片也就是1.jpg。对不对，因为这是图片移啊1.jp能不懂，关键这个位置我怎么知道是移到这个位置来了呢？我是怎么知道移到这个位置来了。这个位置是不是有一个特定的坐标啊，有没有这个坐标应该是固定的吧。啊，不知道。大家想啊，首先啊，我这个地方这一个我看到的部分是不是就这一个部分。是不是啊，还稍微搞小一点啊，稍微搞小一点好，这是我看到的部分，接着呢啊，我换个颜色啊，接着我我能够去啊去做的都，诶我怎么用它了这。

想用他的可以用这个呀，是吧。就这个好，这一个的话，下面呢，我要画一个相对来说比较大，搞一个颜色不一样的是包含所有图片的那个，那个历史的div啊，那个历史的div啊，OK，大家看啊。呃，我们来看一下。呃，这里面呢，假设这个是一张图片啊，这是一张图片，我移了一下是不是这一张开始在这里对吧？要在这里的话大家看啊，大家看到我就把它放到下面吧，好吧，我就把它放在下面，别放到一出合了啊。还得要一个两个三个四个五个六个七个差不多啊，就这样子吧，其他不变啊，这是它的一个坐标，来我们来去分一下啊，这个里面这是一张是吧？啊，这是一张，再来一张，这是两张啊三张。

四张。哎呀，我天是不是有点大是吧，没关系啊，啊，给他一起就行。一共是什么七张图片，那而且你要知道啊，你要知道这一个是哪张图片，是不是5.jpg是不是懂不懂，而这一个是什么，一点接PG1定要看清楚是谁啊，而这一个是么？二点接PG，依次往下对不对啊，依次往下啊，这没什么好说的。

嗯，JPG，我把它写出来4.jpg。接着五啊，最后一张又是1.jbg。好，刚才我们说过了，我们说了当我看到的，当我看到的是最右边的这个1.gb的时候，我应该跳哪去。我是不是应该跳到这里来，是不是能不懂，那我们是不是就要求出这个点的坐标和这个点的坐标。是不能不懂，能理解吧，也就是说，也就是说什么意思啊，我看到他的时候，我我看到了它，也就是我刚才我的我的这个往右边的这个东西停到这里的时候。是吧，啊，它应该是现在我当前的这个life的值等于多少，当前的life的值等于多少，首先是个正数还是个负数。

是个什么数？负数负多少了？首先你看嘛，这是这是这里面是一个单位的长度吧，这是两个单位的长度，这是三个，这是四个。这是什么？这里是一个，这里是两个，这里三个，这里四个，这里是什么？五个，这里是六个，看到他了吧，是吧。我看一下这不对吗？这里面我我停在这里的时候，我停到这里的时候，Life的值等于多少，是不是负负600对吧？啊，我等于负600，呃，我停在我刚好停在这里的时候呢。是吧，多少是三千六还是3000是3600，能不能懂。

哎，关键是我我这个地方啊，大家看到我要停留在这里，我应该跳到哪里去，跳到这里吧，我要停留在这里了，我是不是要跳到这里，来来想想这里啊，那我们先看出来停留在这里，我当前的那个坐标怎么算呢？就是我的life的值。等于假设我的那个，我是不是应该有一个图片的那个图片真正的过程，我图片现在是几个，实际上是五张图片，对不对，就是我们要看的是真实个数啊，看真实个数不要看什么，我左边加了一个，右边加了一个，不要看这些东西，我们要看真实个数是多少个啊，也就是说我们的image什么countt等于。是不是大于等于五，这个是实际上本来说应该是个变量，对不对，因为有可能是五张，也可能六张，对不对？好，你跟我动态计算一下这个life的值。

这个贷款是首先是负数没问题吧，负数负多少了。是image什么看乘以它吗？是乘以那个我的那个认识嘛，也是600吗。是这样吗？是不是就这样的吗？大小你就想嘛，我这里面在这里面是不是已经是六六百了。是不是，而到这里面是五倍的600。到这里是不是要加一呀，懂不懂你一个推嘛，你推也推理出来了。能不能看出来啊，OK，好，那我此时我应该变为多少了。

也就是说我冲了一下是不是要到到南来哟，画的有点太那个了啊，是不是到这里来，是不是到这里来，他的live的值应该等于多少。也就说当前的life的值应该等于多少，对吧，是不是负600是不是是的吧，好，那还有一种情况，还有一种情况，那有可能是不是停留在这里，是跑到这里来了，但你能停在这吗？不能，你要从这个位置跳哪去？是不是跳到这里来。是不是，那也就是说，那也就是说你要知道当前这个位置，我要看到当前这个五点接B，它life值应该等于多少是吧，是不是零。对不对啊，我这一个呢，这个应该你能知道了，现在当前life值等于负的image抗乘以600，你说你怎么这么快就知道了。

那不瞬间知道了吗？它是加一，那我再往左推一格，那不就是减一了吗？减一不就是一脉看到了吗？对不对。知道这个事就很简单了，什么意思，大家看啊。那也就是说我们是不是有两种情况要跳转。好，你说我应该在哪去写这个代码呢？我是不是应该是我是不断移动，难道我在这个我在移动的过程中去跳吗？不是，肯定是什么已经到了目标位置，发现诶你在最左边或者在什么这一边，是不是我已经达到达了目标位置，我才会去判断我当前需不需要跳到另外位置。是不是？

什么意思？说白了就我们下面要写代码，应该在哪写呢？应该这个if里面写。在这个if里面写写什么呢？先注先说明一下啊，如果到达了什么，最右边的一张图片。最右边的图片实际上是谁呀，是不是我那个五点接啊，那个1.jpg，因为我这边最右边那个不是1.tpt嘛，是不是，那我应该啊跳到哪去到哪去，最左边的第几章第二章。而他的那个图片也是谁，也是什么一点，必须是同一张。

对不对？好，除了这种情况还有什么，如果到达了什么最左边的图片，那也就是说我们当前的什么五点接BG，那我跳到哪去了，跳转到，所以右边的什么也是什么第二张图片，那它对应的是哪张图片，五点截PG。这意思吧，那我是不是就来一些if判断判断什么。我的current，那等等于好了，你这个到达最右边，到达最右边，刚才我们已经分析过了，它应该是不是这个值是不是二，我应该怎么写呢。首先写个符号是吧。啊，写一个配啊，我一个我定义了一个叫我的，我是不是有个括号叫image count有吗？我这个image cant定义了吗？是不是定义一下啊，Image cant要定义一下，在上面就可以求出来，其实一麦抗等于多少呢？比如说等于五。

不行，不能这么做，写死了多RA point。点。对不对？你的原点是不是用来标识每一张图片呢？好，那有了它，那我应该怎么写呢？加上什么一接着干嘛去乘以我是不是有一个配。对不对？那如果是这样的话，我的current left应该等于多少呢？刚才说过了，看看这里应该等于多少负600，那也就是负的什么page y下面是不是有一个else if，还有一个else if。

对吧，哎，衣服是不是这个呢，这个。那刚才说过了，Current and left。看一下等于几零，那我应该让他最后看应该等于几了。把这一个拿过来。是吧，把这个加一给他什么是不是去掉。有没有看到是这样的吧，是的。那你在想啊，这个时候我们是不是能够去循环了呢。就这这么个事啊，分享半天。

就写的这么四行代码搞定啊。但有的时候真是分析比那个写代码更复杂一些，很正常，经常是这样的情况，越是难的东西，它代码量不一定很大，来看一看行不行。看看啊，来一下纤维一上来就有一样向左翻对不对走。可以可以吧，好大家看看。诶，这个还居然暴露出来了。我现在不能快点发啊，快发就有问题。可不可以，可以吧，啊，可以，这没问题啊，这不循环玩意吗？人老师你这个点子不动了，这不还没做吗？它能自动动，那不神奇了吗？看不眼可以，但这里面刚才是不是看到一个bug，咔咔一顿翻。啊，这个是我们后面要说的一个问题，这里面是有bug的，但我们先先先搞正常，别搞这个东西，先不要搞这个东西啊，我们先把正常的功能给它完成，再去解决这个bug。

没问题吧，啊，文南说你不要背啊，你不要抄，抄了一点用都没有，你先分析一下，看这个值是不是怎么变化的。