function leftMove(obj,direction,lis){
var num = 0;
var liWidth = lis[0].offsetWidth;
setInterval(function(){
if(num<parseInt(liWidth/10)){
if(direction=="left" && obj.offsetLeft<0){
obj.style.left = obj.offsetLeft + 10 + "px";
num == parseInt(liWidth/10)-1 ? (obj.style.left = obj.offsetLeft + liWidth%10 + "px"):null;
}
else if(direction=="right" && obj.offsetLeft>-liWidth*(lis.length-1)){
obj.style.left = obj.offsetLeft - 10 + "px";
num == parseInt(liWidth/10)-1 ? (obj.style.left = obj.offsetLeft - liWidth%10 + "px"):null;
}
}
num++;
},10)
}

js简版图片左右切换功能的更多相关文章

  1. 极简的js点击组图切换效果

    程序员进行前端开发时,时常要用到点击切换组图的动画效果,网上确实有很多此类插件,但是都很麻烦,乌糟糟无数代码,有那个看的时间,自己都能把功能写完了.在这里我提供一段极简的js点击组图切换效果代码,包含 ...

  2. JS 实现 Tab标签切换功能

    Tab标签切换 效果图: HTML部分: <div class="wrap">     <ul id="tag">       < ...

  3. vue实现tab切换功能

    最近用vue做一个页面的tab功能,经过一查找资料,没用路由,也没用动态组件,完美实现了tab切换功能,效果如下 下面是代码实现,这是模板 <article id="example&q ...

  4. tabs自动切换功能的实现

    <html><head><!-- Bootstrap 核心 CSS 文件 --> <link rel="stylesheet" href= ...

  5. html+css+jQuery+JavaScript实现tab自动切换功能

    tab1.html内容 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...

  6. JS实现下拉菜单的功能

    <!DOCTYPE html> <html> <head> <meta charset = "utf8"> <title> ...

  7. js、jquery实现列表模糊搜索功能

    实现的搜索功能: 1. 可以匹配输入的字符串找出列表中匹配的项,列表框的高度跟随搜索出的列表项的多少改变 2. 可以点击某一项进行选中列表项 3. 可以按下上.下.回车键来控制列表项 4. 按下回车键 ...

  8. Vue + Element-ui实现后台管理系统(3)---面包屑 + Tag标签切换功能

    面包屑 + Tag标签切换功能 有关后台管理系统之前写过两遍博客,看这篇之前最好先看下这两篇博客.另外这里只展示关键部分代码,项目代码放在github上: mall-manage-system 1.V ...

  9. 基于.NetCore开发博客项目 StarBlog - (14) 实现主题切换功能

    系列文章 基于.NetCore开发博客项目 StarBlog - (1) 为什么需要自己写一个博客? 基于.NetCore开发博客项目 StarBlog - (2) 环境准备和创建项目 基于.NetC ...

随机推荐

  1. ios企业应用发布流程

    转载自:http://blog.csdn.net/justinjing0612/article/details/8758692留作备忘 企业发布app的 过程比app store 发布的简单多了,没那 ...

  2. 面向对象的小demo

    两个类如下 package cao.com.duixiang; import java.util.Arrays; public class OtherTest { //求max public int ...

  3. ios 多线程小结----- GCD篇

    //3 GCD(充分利用设备的多盒)-------------屏蔽了线程,只能看见任务 队列步骤两步,定制任务,将任务添加到队列.GCD将添加的任务,放到线程中去执行,自动执行,自动释放原则:先进先出 ...

  4. Android 毛玻璃效果

    muzei live wallpaper https://github.com/romannurik/muzei

  5. 加载gif动画的三种方式

    GifView.h/** * 调用结束就开始播放动画,如果需要用户指定何时播放的话,只需要把timer的开始放到合适的位置.通过对CFDictonaryRaf 也就是gifProperties的改变, ...

  6. js DOM对象

    查找元素 根据id找 document.getElementById("b"): 根据class找 document.getElementsByClassName("aa ...

  7. EF学习 笔记-----EF映射

    http://www.cnblogs.com/guomingfeng/archive/2013/06/15/mvc-ef-configuration-migration.html EF flountA ...

  8. CLR via C#学习笔记----知识总概括

    第1章 CLR的执行模型 托管模块的各个组成部分:PE32或PE32+头,CLR头,元数据,IL(中间语言)代码. 高级语言通常只公开了CLR的所有功能的一个子集.然而,IL汇编语言允许开发人员访问C ...

  9. 聊聊SOA面向服务架构

    什么是SOA SOA(Service-Oriented Architecture),即面向服务的架构.SOA是一种粗粒度.松耦合服务架构,服务之间通过简单.精确定义接口进行通讯,不涉及底层编程接口和通 ...

  10. 《Spring 3.x 企业应用开发实战》目录

    图书信息:陈雄华 林开雄 编著 ISBN 978-7-121-15213-9 概述: 第1章:对Spring框架进行宏观性的概述,力图使读者建立起对Spring整体性的认识. 第2章:通过一个简单的例 ...