旋转木马代码

DTechnology

于 2018-04-17 21:33:59 发布

阅读量1.4k

点赞数 2

分类专栏：笔记文章标签：旋转木马

本文链接：https://blog.csdn.net/DTechnology/article/details/79981219

版权

html

<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title>旋转木马轮播图</title>
  <link rel="stylesheet" href="css/css.css"/>
  <script src="common.js"></script>
  <script>
    //
    var config = [
      {
        width: 400,
        top: 20,
        left: 50,
        opacity: 0.2,
        zIndex: 2
      },//0
      {
        width: 600,
        top: 70,
        left: 0,
        opacity: 0.8,
        zIndex: 3
      },//1
      {
        width: 800,
        top: 100,
        left: 200,
        opacity: 1,
        zIndex: 4
      },//2
      {
        width: 600,
        top: 70,
        left: 600,
        opacity: 0.8,
        zIndex: 3
      },//3
      {
        width: 400,
        top: 20,
        left: 750,
        opacity: 0.2,
        zIndex: 2
      }//4

    ];

    //页面加载的事件
    window.onload = function () {
      var flag=true;//假设所有的动画执行完毕了---锁====================================================
      var list = my$("slide").getElementsByTagName("li");
      //1---图片散开
      function assign() {
        for (var i = 0; i < list.length; i++) {
          //设置每个li,都要把宽,