Uploadify button: Style with CSS?

Herb Caudill picture Herb Caudill · Mar 20, 2010 · Viewed 31.5k times · Source

Is it possible to replace the Uploadify button (which is a graphic containing up/over/down states) with a simple CSS-styled button?

Answer

Evan Carroll picture Evan Carroll · Jul 1, 2010

I was able to get away with something massively more simple.

xhtml:

<div id="uploadify">                  
  Upload Pictures                     
  <div id="uploadify" type="button" />
</div>                                

css:

#uploadify object { 
  position:absolute;
  left:0; right:0;  
  width:100%        
}                   

javascript:

$("#uploadify>div").uploadify({                     
  'hideButton'   : true                                
  , 'wmode'      : 'transparent'                         
  , 'uploader'   : '/static/uploadify/uploadify.swf'
  , 'script'     : '/static/uploadify.php'          
  , 'folder'     : '/_uploads'                      
  , 'multi'      : true                             
})                                                  

// If you're using jQuery UI.
$("#uploadify").button(); 

Probably a little easier, now that we have hideButton: true, not sure if @Herb knew about it.

UPDATE I wrote this answer in July of 2010. It's now March of 2013. HTML5 supports multiple file-uploads. Don't use uploadify at all; I don't.