为啥图片会溢出？

js代码：

  var data=[

        {img:1,h1:'Creative',h2:'DUET'},

        {img:2,h1:'Friendly',h2:'DEVIL'},

        {img:3,h1:'Tranquilent',h2:'COMPATRIOT'},

        {img:4,h1:'Insecure',h2:'HUSSLER'},

        {img:5,h1:'Loving',h2:'REBEL'},

        {img:6,h1:'Passionsate',h2:'SEEKER'},

        {img:7,h1:'Crazy',h2:'FRIEND'},

    ];

var g=function(id){

if(id.substr(0,1)=="."){

return document.getElementsByClassName(id.substr(1));

}

return document.getElementById(id);

}

  //添加幻灯片的操作

     function addSliders(){

//获取模板

var tel_main=g("template_main").innerHTML

                .replace(/^\s*/,"")

.replace(/\s*$/,"")

 var tel_ctrl=g("template_ctrl").innerHTML

                .replace(/^\s*/,"")

.replace(/\s*$/,"")

//最终要输出的变量

  var out_main=[];

  var out_ctrl=[];

  //遍历所有数据，构建最终输出的HTML

     for(i in data){

 var _html_main= tel_main

        .replace(/{{index}}/g, data[i].img)

.replace(/{{h1}}/g, data[i].h2)

.replace(/{{h2}}/g, data[i].h3)

 var _html_ctrl=tel_ctrl

         .replace(/{{index}}/g, data[i].img)

 out_main.push(_html_main);

 out_ctrl.push(_html_ctrl);

 }

//把html回写到dom

 g("template_main").innerHTML=out_main.join('');

 g("template_ctrl").innerHTML=out_ctrl.join('');

}

//幻灯片切换

function switchSlider(n){

//获得由展现的幻灯片和控制按钮

var main=g("main_"+n);

var ctrl=g("ctrl_"+n)

//获得所有的幻灯片和控制按钮

    var clear_main=g(".main_i");

var clear_ctrl=g(".ctrl_i");

  for(i=0; i<clear_ctrl.length;i++){

  clear_main[i].className= clear_main[i].className

               .replace("main_i_active','")

      clear_ctrl[i].className= clear_ctrl[i].className

               .replace("ctrl_i_active','")

  }

main.className+="main_i_active"

ctrl.className+="ctrl_i_active"

}

 window.onload=function(){

  addSliders();

 switchSlider(1);

}