从零开始学前端sen

前端基本功:JS(十二)网易轮播图/ 旋转轮播图

2016-11-28  本文已影响403人  越IT

网易轮播图:

网易轮播图.gif

案例素材及源码:
链接:http://pan.baidu.com/s/1pLgzkVp 密码:9buw

json 两种声明方式

1/对象声明

   var  json = {width:100,height:100}

2/ 数组声明

  var  man = [        //  数组的 json  
   {
       name:"刘德华",
       age : 16,
       address: "香港"
   },
   {
       name:"张学友",
       age: 33,
       address: "澳门"
   },
   {
       name:"黎明",
       age: 55,
       address: "大陆"
   }
];
for(var i=0;i<man.length;i++)
{
   console.log(man[i].name);  
}

旋转轮播图

旋转轮播图.gif
案例素材及源码:
链接:http://pan.baidu.com/s/1kU4D9kj 密码:oxrr

旋转原理:

每次点击 按钮, 他们的json 数值就更换就可以了.
删除和添加 数组
pop() 删除最后一个
shift() 删除第一个
push() 追加 添加到最后面
unshift() 添加到 第一个位置
** 把 最后一个json 删除 并且把最后一个添加到json 第一个位置**
json.unshift(json.pop());
json.pop() 删除最后一个元素
console.log(json.pop()) 返回最后一个值

上一篇 下一篇

猜你喜欢

热点阅读