zoukankan      html  css  js  c++  java
  • 转换思路

    需求人员,会改html但是不会js, 但是页面的变化需要改动js, 

    解决办法,把js的变动转变成html的变动

    需求: 在ul中的li 轮训显示,div的背景色要随着轮播图片的变化而变化

    <div  id="div">
    <ul>
     <li  style="display:block"><img src="1.jpg"/></li>
     <li   style="display:none"><img src="2.jpg"/></li>
     <li   style="display:none"><img src="3.jpg"/></li>
    </ul>
    </div>

    <script>

    var arrs=[{img:"i.jpg":color:"red"},{img:"2.jpg",color:"green"},{img:"3.jpg",color:"blue"}];
    <script>
     

    问题: 对于轮播背景色的变化需要用一个数组存储颜色跟图片的对应关系,但是当改动轮播图片的时候这个数组需要跟随变动,对于一个一般人员,改动js的学习代价很高,并且,她们没法理解数组这样专业的数据结构容易出现问题

    解决办法: 把颜色跟图片的对应关系转化js数组形式,转化为html中存储这种对应关系,这样学习成本就低很对,并且易于他们理解

    <div  id="div">
    <ul>
     <li  style="display:block" data-color="red"><img src="1.jpg"/></li>
     <li   style="display:none" data-color="green"><img src="2.jpg"/></li>
     <li   style="display:none" data-color="blue"><img src="3.jpg"/></li>
    </ul>
    </div>


  • 相关阅读:
    ASP.NET登录记住用户名
    .NET枚举类型转为List类型
    display:inline-block 去除间隙
    sublime text 3 常用快捷键 、常用插件
    使用背景图代码
    Photo Shop 修改、维护
    前端协作流程
    Photo Shop切图
    Photo Shop 设置
    Flex 弹性布局
  • 原文地址:https://www.cnblogs.com/xinxinzhihuo/p/5682736.html
Copyright © 2011-2022 走看看