JSFiddle - React, Tailwind, and code Playground

HTML

<h1>鼠标左键点击图片-并左右移动</h1>
 <div id="content">
    <img id="car" src="http://images.cnitblog.com/blog/150659/201307/30094341-d352147c67e844c18c302810804efea0.gif" />
 </div>

CSS

*{margin: 0;padding: 0}

      h1{background-color: #666;color: #fff;text-align: center;margin:10px;}
      #content{margin:10px;border: 5px solid #666;text-align: center;}

JavaScript

var _CalF = {
   $ : function(object){//选择器
     if(object === undefined ) return;
     var getArr = function(name,tagName,attr){
           var tagName = tagName || '*',
               eles = document.getElementsByTagName(tagName),
               clas = (typeof document.body.style.maxHeight === "undefined") ? "className" : "class";//ie6
               attr = attr || clas,
               Arr = [];
           for(var i=0;i<eles.length;i++){
             if(eles[i].getAttribute(attr)==name){
               Arr.push(eles[i]);
             }
           }
           return Arr;
         };
   
     if(object.indexOf('#') === 0){  //#id 
       return document.getElementById(object.substring(1));
     }else if(object.indexOf('.') === 0){  //.class
       return getArr(object.substring(1));
     }else if(object.match(/=/g)){  //attr=name
       return getArr(object.substring(object.search(/=/g)+1),null,object.substring(0,object.search(/=/g)));
     }else if(object.match(/./g)){ //tagName.className
       return getArr(object.split('.')[1],object.split('.')[0]);
     }
   },
   addHandler:function(node, type, handler){
       node.addEventListener ? node.addEventListener(type, handler, false) : node.attachEvent('on'+ type, handler);
   }
 };



function show360(){
  this.init.apply(this, arguments);
}

show360.prototype = {
  init:function(id,src){
      var divId = "#"+id,
          div = _CalF.$(divId);
      this.div = div;
      this.src = src;
      this.xDown; //鼠标按下x的值
      this.isDown = false;
      this.i = 1;
      this.moved;
      this.time;
      this.loadImg();
      this.addEvent();
  },
  setImgSrc : function(i){
    var img = this.div.getElementsByTagName("img")[0];
    img.setAttribute('src',this.src+i+'.png');
  },
  loadImg : function(){ //加载图片
    var that = this,
        num = 1,
        imgs =[];
    for(var i=1; i<37; i++){
        imgs[i] = new Image;
        imgs[i].src = that.src + i + '.png';
        imgs[i].onload = function(){
         ...