Jump to content

Help with FaceBox and Uploadify


roeyhaim

Recommended Posts

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?

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.