Colorbox trop large lors de l'ouverture

Question

J'ai une palette de couleurs qui s'affiche environ deux fois plus large que la commande css. Un exemple est here. Cliquez sur l'une des images, et vous verrez que la boîte est environ deux fois la taille qu'elle devrait être. C'est la même chose dans FF et IE. Il n'y a rien dans the css qui a une largeur de 1200. Pourquoi le ferait-il?

C'est ici que je donne le code de la palette de couleurs.

<link media="screen" rel="stylesheet" href="colorbox/colorbox.css" /> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script> 
<script src="colorbox/jquery.colorbox.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
    //Examples of how to assign the ColorBox event to elements 
    $("a[rel='example1']").colorbox(); 
    $("a[rel='example2']").colorbox({transition:"fade"}); 
    $("a[rel='example3']").colorbox({transition:"none", width:"75%", height:"75%"}); 
    $("a[rel='example4']").colorbox({slideshow:true}); 
    $(".example5").colorbox(); 
    $(".example6").colorbox({iframe:true, innerWidth:425, innerHeight:344}); 
    $(".example7").colorbox({width:"80%", height:"80%", iframe:true}); 
    $(".example8").colorbox({width:"50%", inline:true, href:"#inline_example1"}); 
    $(".example9").colorbox({ 
     onOpen:function(){ alert('onOpen: colorbox is about to open'); }, 
     onLoad:function(){ alert('onLoad: colorbox has started to load the targeted content'); }, 
     onComplete:function(){ alert('onComplete: colorbox has displayed the loaded content'); }, 
     onCleanup:function(){ alert('onCleanup: colorbox has begun the close process'); }, 
     onClosed:function(){ alert('onClosed: colorbox has completely closed'); } 
    }); 

    //Example of preserving a JavaScript event for inline calls. 
    $("#click").click(function(){ 
     $('#click').css({"background-color":"#f00", "color":"#fff", "cursor":"inherit"}).text("Open this window again and this message will still be here."); 
     return false; 
    }); 
}); 
</script> 

Ceci est le code qui crée l'image affichée dans la palette de couleurs.

<div class="gallerywrap_1"> 
    <a href="<?=$pic2?>" title="<?=$caption?>" rel="example3"> 
     <div class="gallery_1"> 
      <div class="galleryimg_1" style="background-image: url(<?=$pic?>)"></div> 
     </div> 
    </a> 
</div> 

Answer 1

Le colorbox javascript définit la largeur en fonction de la résolution de l'écran. /taille

$("a[rel='example3']").colorbox({transition:"none", width:"75%", height:"75%"}); 

Essayez de changer cela à une largeur de pixel ou apporter la largeur de pourcentage vers le bas.

Espérons que cela aide.