Subir avatar a un servidor web
hola les vengo con un nuevo sistema de uplouds file para php y con ajax
es algo mas nuevo no tenes que abir una ventana emergente para cargar el avatar
para descargar el proyecto https://dropbox.com/s/f79rm27duds43ff/uplouds.zip
en el index.php
creamos un archivo style.css
es algo mas nuevo no tenes que abir una ventana emergente para cargar el avatar
para descargar el proyecto https://dropbox.com/s/f79rm27duds43ff/uplouds.zip
en el index.php
<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>AJAX uploader plugin</title> <meta name="description" content="Demo de uploader ajax, usando un plugin para jquery" /> <meta name="keywords" content="jquery, ajax" /> <script language="javascript" src="js/jquery-1.3.1.min.js"></script> <script language="javascript" src="js/AjaxUpload.2.0.min.js"></script> <script language="javascript"> $(document).ready(function(){ var button = $('#upload_button'), interval; new AjaxUpload('#upload_button', { action: 'upload.php', onSubmit : function(file , ext){ if (! (ext && /^(jpg|png|jpeg|gif)$/.test(ext))){ // extensiones permitidas alert('Error: Solo se permiten imagenes'); // cancela upload return false; } else { button.text('Erepera'); this.disable(); } }, onComplete: function(file, response){ button.text('Subir'); // enable upload button this.enable(); // Agrega archivo a la lista $('#lista').appendTo('.files').text(file); } }); }); </script> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="upload_button">subir</div> <ul id="lista"> </ul> </body> </html>creamos un nuevo archivo llamdo upload.php
<?php $uploaddir = 'uploads/'; $uploadfile = $uploaddir . basename($_FILES['userfile']['name']); if (move_uploaded_file($_FILES['userfile']['tmp_name'], $uploadfile)) { echo "success"; } else { echo "error"; } ?>creamos una carpeta js
creamos un archivo style.css
/* CSS Document */ body { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#333333; } #upload_button { width:120px; height:35px; text-align:center; border: 1px solid #3583BE; text-shadow: 1px 1px #797979; float: left; height: 26px; line-height: 23px; width: 87px; cursor: pointer; color: #fff; background: -webkit-linear-gradient(#2091E7, #3382BE); background: -moz-linear-gradient(#2091E7, #3382BE); background: -o-linear-gradient(#2091E7, #3382BE); outline: none; border-radius: 3px; } #upload_button:hover{ color:#FFFFFF; }espere que les sirva para sus proyectos
10
Puntos
Puntos
2176
Visitas
Visitas
2
Resp
Resp
Por maticapu98 hace 122 meses
Principiante
Respuesta #1
increíble loco, gracias por el aporte
0
Puntos
Puntos
Por alber hace 122 meses
Administrador
Respuesta #2
gracias
Estas muy bueno esta funcion por que no tenes que abir una ventana emergente
es mas practico
Saludos Alber
Estas muy bueno esta funcion por que no tenes que abir una ventana emergente
es mas practico
Saludos Alber
0
Puntos
Puntos
Por maticapu98 hace 122 meses
Principiante