Hello everyone
I try to work with Uploadify and Facebox.
When the user upload a image i want the image to be link to the BIG image and this link should open in facebox.
If i put a link directly it's work fine
The problem start when i try to work with uploadify, then the link act as regular link and not with facebox.
This is my code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>upload</title>
<link href="<?php echo $base; ?>/js/uploadify.css" type="text/css" rel="stylesheet" />
<link href="<?php echo $base; ?>/js/facebox.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript" src="<?php echo $base; ?>/js/swfobject.js"></script>
<script type="text/javascript" src="<?php echo $base; ?>/js/jquery.uploadify.v2.1.4.min.js"></script>
<script type="text/javascript" src="<?php echo $base; ?>/js/facebox.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('a[rel=facebox]').facebox({
loadingImage : '<?php echo $base; ?>/js/loading.gif',
closeImage : '<?php echo $base; ?>/js/cancel.png'
});
$('#file_upload').uploadify({
'uploader' : '<?php echo $base; ?>/js/uploadify.swf',
'script' : '<?php echo $base; ?>/index.php/home/uploadify',
'cancelImg' : '<?php echo $base; ?>/js/cancel.png',
'folder' : 'uploads',
'fileDesc' : 'Image Files',
'fileExt' : '*.jpg;*.jpeg;*.gif;*.png',
'multi' : true,
'auto' : true,
'onComplete': function(event, ID, fileObj, response, data){
$("#uploaded_preview").append("<a href='<?php echo $base; ?>/uploads/" +response+ "' rel='facebox'><img src='<?php echo $base; ?>/uploads/thumbs/" +response+ "' width=\'150px\' height=\'150px\'></a>");
$("input:hidden.image").val(response);
}
});
});
</script>
<div id="uploaded_preview">
</div>
<input id="file_upload" name="file_upload" type="file" />
<input type="hidden" class="image" name="image" id="image" value=""/>
<p>
<a href="http://images.paraorkut.com/img/pics/images/h/hey_sexy-2377.jpg" rel="facebox">This link work fine</a>
</html>
any idea how i can make this work?