My Jcrop plugin isn’t working properly.
I can select an area to crop, but there are no little resize squares at the edges. I don’t know if this is a specific function or a default setting.
This is what I mean. My crop area looks like this now:
My crop background is red and the selected area has the original color, but the strange thing is that there are no resize squares like in this picture:
My code looks like this:
The head:
<head>
<title>Het Vergeet-mij-nietje</title>
<script type="text/javascript" src="js/showfunctie.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/jquery.Jcrop.min.js"></script>
<link rel="stylesheet" href="style/css/demos.css" type="text/css" />
<script language="Javascript">
jQuery(function($){
var jcrop_api;
$('#cropbox').Jcrop({
bgColor: 'red'
},function(){
jcrop_api = this;
});
$('#animbutton').click(function(e){
jcrop_api.animateTo([ 120,120,80,80 ]);
return false;
});
$('#delselect').click(function(e){
jcrop_api.release();
return false;
});
});
</script>
</head>
My image code:
<div id="content1">
<?php
$target = "uploads/";
$target = $_POST["imagesource"];
$target = $target . basename( $_FILES['filename']['name']) ;
$ok=1;
if(move_uploaded_file($_FILES['filename']['tmp_name'], $target))
{
echo "De afbeelding *". basename( $_FILES['filename']['name']). "* is geupload naar de map 'uploads'";
}
else {
echo "Sorry, er is een probleem met het uploaden van de afbeelding.";
}
?>
<br /> <br />
<img id="cropbox" src="<?php echo $target ?>" width="400px" />
<br /> <br />
</div>
I hope someone knows what’s the problem 🙂
Have you looked at this JCrop styling example? maybe it’s a CSS problem?
Do you have a live example of your code?