coexistence de 2 plugin (jCrop + FancyBox)

starkson · 05/03/2011, 19h31

Bonjour, mon probleme aura au moins le merite d'etre simple à expliquer.
Je souhaiterai utiliser à l'interieur d'une FancyBox (lightbox) le plugin jCrop (cropping d'image).

Chaque plugin marche parfaitement separement, mais du moment ou je mets l'image concerné par le jCrop à l'interieur d'un "popup fancybox" ça ne marche plus.

L'image "croppable" n'apparait plus (elle est hidden à en croire firebug) et je ne comprends pas pourquoi.

Si je ne touche rien au code mais que je "sors" l'image de la fancybox ça remarche.

Je ne comprends du coup pas d'ou peut venir le probleme :/

Javascript:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
// JavaScript Document
$(  function(){
		jQuery('#cropbox').Jcrop({
        onChange: showPreview,
        onSelect: showPreview,
			  aspectRatio: 1
		});
});
 
 
jQuery(window).load(function(){
    $("#btn_test").fancybox({
	'titlePosition'	: 'outside',
	'transitionIn'	: 'none',
	'transitionOut'	:'none'								
		});
});

html:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
 
<body>    
<a id="btn_test" href="#popup_test"><h4>Test2</h4>     		            
<div style="display: none;">
  <div id="popup_test">
    <img src="demo_files/flowers.jpg" id="cropbox" />
  	<div style="width:100px;height:100px;overflow:hidden;">
			<img src="demo_files/flowers.jpg" id="preview" />
		</div>
  </div>
</div>
</body>

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email