Comment supprimer la barre de défilement affichée à l'aide de l'échelle de transformation?

Question

J'essaie de développer un curseur Image. Je souhaite que les images soient agrandies jusqu'à la prochaine prise de vue. J'utilise actuellement la propriété d'échelle de transformation. Il déborde de la largeur et provoque l'affichage d'une barre de défilement. Comment cette barre de défilement peut-elle être supprimée?

HTML:

<div id="pn-head"> 
</div> 

JS:

 var i = 1; 
     function tSlide(){ 
      if(i<=5){ 
       jQuery('#pyn-head').attr('class','pn-head head-bg'+i); 
      } 
      i = i+1; 
      if(i==6){ 
       i=1; 
      } 
     } 
     tSlide(); 
     setInterval(tSlide , 5000); 

CSS:

.pn-head{ 
    height: 700px; 
    background-size: cover !important; 
    background-repeat: no-repeat !important; 
    -webkit-transition: background 1s ease-out; 
    -moz-transition: background 1s ease-out; 
    -o-transition: background 1s ease-out; 
    transition: background 1s ease-out; 
    -webkit-transition: transform 2s ease-out 1s; 
    -moz-transition: transform 2s ease-out 1s; 
    -o-transition: transform 2s ease-out 1s; 
    transition: transform 2s ease-out 1s; 
} 
.head-bg1{ 
    background: url('../img/b1.png'); 
    transform: scale(1.1); 
} 
.head-bg2{ 
    background: url('../img/b2.png'); 
    transform: scale(1.2); 
} 
.head-bg3{ 
    background: url('../img/b3.png'); 
    transform: scale(1.3); 
} 
.head-bg4{ 
    background: url('../img/b4.png'); 
    transform: scale(1.4); 
} 
.head-bg5{ 
    background: url('../img/b5.png'); 
    transform: scale(1.5); 
} 

Answer 1

Ajouter cette option pour supprimer toutes les barres de défilement:

<style type="text/css"> 
body { 
    overflow:hidden; 
} 
</style>