上回一边看了一边写了以后出了bug，删了几行代码又好了，因为不是很明白作用，就特地来问一下

1.

 //7.增加 #main_background 

      // g('template_main').innerHTML+=tpl_main.replace(/{{index}}/g,data[i].img).replace(/{{h2}}/g,data[i].h1).replace(/{{h3}}/g,data[i].h2);

      // g('main_'+i).id='main_background';

//7.2 切换时,复制上一张幻灯片到main_background中

      // setTimeout(function(){

      //   g('main_background').innerHTML=main.innerHTML;

      // },1000)

这个main_background有什么用，没了他我的bug反倒好了

2.

.slider .main .main-i .caption{

        position: absolute;right: 50%;top: 30%;z-index:9;margin-right: 13%;

        }

        .slider .main .main-i .caption h2{

        font-size: 40px;

        line-height: 50px;

        color: #B5B5B5;

        text-align: right;

        }

        .slider .main .main-i .caption h3{

        font-size: 70px;

        line-height: 70px;

        color: #000000;

        text-align: right;

        font-family: 'Open Sans Condensed';

        }

       .slider .main .main-i h2,

       .slider .main .main-i h3{

       opacity: 0;

       -webkit-transition: all .8s 1s;

       -o-transition: all .8s 1s;

       transition: all .8s 1s;

       }

       .slider .main .main-i h2{

       margin-right: 45px;

       }

       .slider .main .main-i h3{

       margin-right: -45px;

       }

       .slider .main .main-i_active h2,

       .slider .main .main-i_active h3{

       margin-right: 0px;

       opacity: 1;

       }

这是我整理的h2h3所用css，求大神说明动画出现的主要过程，还有，有没有简化的