zoukankan      html  css  js  c++  java
  • jquery的焦点图片无限循环关键思维

    在循环的时候,关键的是按(下一页按钮)到最后一页的时候和按(上一页按钮)到到第一页的时候如何转换;

    首先必须知道3个js方法,prepend()、append()和clone();

    prepend() 方法在被选元素的开头(仍位于内部)插入指定内容。 

    append() 方法在被选元素的结尾(仍然在内部)插入指定内容。

    clone() 方法生成被选元素的副本,包含子节点、文本和属性,简单说就是克隆元素。

    看下图,比如有四张图片循环,虚线为当前视区,按Prve按钮的时候,当前位置发生变化,当图片1到视区的时候,用clone()方法克隆一份图片4插入到图片1的前面prepend(),

    当按Next按钮,图片四到视区的时候,克隆clone()一份图片1到图片四的后面append(),这样就得到了数列:3(克隆的),0,1,2,3,0(克隆的),有这个数列就方便我们判断了,思路为:默认显示

    序列0,当按Prve按钮到图片1的时候,判断如果序列少于0就等于3;当按Next按钮到图片4的时候,判断如果序列大于3就等于0;这样就实现无限循环了。

     

    效果如下:

  • 相关阅读:
    模糊查询与索引
    weblogic 域的创建
    undo表空间缩小
    weblogic安装
    C#学习笔记——枚举类型
    C#学习笔记——windows窗体
    Qt之主窗口设计——打印图像
    C#学习笔记——MDI窗体(多文档界面)
    C#学习笔记——抽象类和抽象方法
    C#学习笔记——Main方法
  • 原文地址:https://www.cnblogs.com/smedas/p/12537184.html
Copyright © 2011-2022 走看看