Carrousel Bootstrap avec arrière-plan

Question

Mon client a un modèle de bootstrap. J'ai fait un curseur là: Slider

Les images ne bougent que dans un ordinateur portable. Je veux ajouter une description sur le côté droit de l'ordinateur portable (maintenant la description de glissement ne fonctionne pas). Et je n'ai aucune idée de comment le faire. J'ai essayé beaucoup de variations. Ou mieux et plus vite juste pour écrire le curseur moi-même, ne pas utiliser Bootstrap?

Seront reconnaissants pour toute aide!

html:

<!-- Indicators --> 
    <ol class="carousel-indicators"> 
    <li data-target="#myCarousel" data-slide-to="0" class="active"></li> 
    <li data-target="#myCarousel" data-slide-to="1"></li> 
    <li data-target="#myCarousel" data-slide-to="2"></li> 
    </ol> 

    <!-- Wrapper for slides --> 
    <div class="carousel-inner"> 
    <div class="item active"> 
     <img src="images/people.png" alt=""> 
    </div> 

    <div class="item"> 
     <img src="images/people.png" alt=""> 
    </div> 

    <div class="item"> 
     <img src="images/people.png" alt=""> 
    </div> 
    </div> 

    <div class="carousel-description current"> 
    <div>Отчёт по результатам обследования в форме документа в PS QUASTIO PRO</div> 
    </div> 
    <div class="carousel-description"> 
    <div>Отчёт по результатам обследования в форме документа</div> 
    </div> 
    <div class="carousel-description"> 
    <div>Отчёт по результатам обследования</div> 
    </div> 

    <!-- Left and right controls --> 
    <a class="left carousel-control" href="#myCarousel" data-slide="prev"> 
    <span class="glyphicon glyphicon-chevron-left"></span> 
    <span class="sr-only">Previous</span> 
    </a> 
    <a class="right carousel-control" href="#myCarousel" data-slide="next"> 
    <span class="glyphicon glyphicon-chevron-right"></span> 
    <span class="sr-only">Next</span> 
    </a> 
</div> 

CSS:

#myCarousel{ 
    height: 510px; 
    background: url(../images/computer.png) no-repeat; 
    background-size: 1350px auto; 

} 

#myCarousel .carousel-inner{ 
    width: 441px; 
    height: 250px; 
    position: absolute; 
    left: 225px; 
    top: 24px; 
} 

.carousel { 
    margin-bottom: 0; 
} 

#myCarousel .carousel-inner .item img{ 
    width: 441px; 
    height: 250px; 
} 

.carousel-description{ 
    display: none; 
    width: 25%; 
    position: absolute; 
    right: 150px; 
    top: 185px; 
    font-size: 20px; 
} 

.carousel-description.current{ 
    display: block; 
} 

Answer 1

Vous pouvez utiliser mon code qui ne marche pas utiliser une bibliothèque et est similaire à l'image que vous avez joint, il suffit de changer le chemin de photos de css. vous pouvez contrôler la vitesse des lames de changer la variable yourinterval

var yourinterval=2000; 

DEMO: http://jsbin.com/xegufazuyi/2/edit?html,css,js,output