2011-07-29 15 views
2

私は自分のサイトでjQuery UIを使用しており、標準のグレーのアップロードボタンではなく、アップロードボタンのスタイルをどのように使用できるのだろうと思っています。アップロード灰色のグラデーションボタンに自分のスタイルを適用するにはどうすればよいですか?

はJavaScript:

<script type="text/javascript"> 
$(document).ready(function() { 
     $("button").button(); 
     $("input:button").button(); 
     $("#file_upload").button(); 

    $('#file_upload').uploadify({ 
    'uploader' : 'files/uploadify.swf', 
    'script' : 'files/uploadify.php', 
    'cancelImg' : 'files/cancel.png', 
    'folder' : 'uploads/', 
    'auto'  : false, 
    'multi'  : true, 
    'buttonText' : 'Choose Pictures', 
    'onAllComplete' : function(event,data) { 
     alert(data.filesUploaded + ' files uploaded successfully!'); 
    }, 
    'hideButton' : true 
    }); 
}); 
</script> 

HTML:

<form id="upload_images" name="form1" action=""> 
<input type="file" id="file_upload" name="file_upload" /> 
<a href="javascript:$('#file_upload').uploadifyUpload();">Upload Files</a> 
</form> 

これは可能ですか? buttonimgオプションを使用してみましたが、「ボタン」の上にテキストが表示されないため、非常に良い結果が得られていないようです。下に示すように、私はhidebuttonオプションも試していますが、これは灰色のボタンを隠すだけです。何か案は?

+0

あなただけ弾丸をかむと、ちょうどその上にテキストと画像を作成する必要があります。それが最も簡単な解決策になります。 – rkw

答えて

0

Uploadifyパッケージをダウンロードした後、グレーのボタンがAdobe Flashを使用して実装されたようです。 Firebugのボタンをチェックすると、埋め込まれたフラッシュオブジェクトであることがわかります。

申し訳ありませんが、あなたの問題に対する解決策はありません。

3

Uploadifyのグレーのボタンスタイルを変更しました。私はちょうど詰め込むの下に追加しました:

'buttonImg': 'images/create_album.png', 
'width': '273', 
'height': '51', 
'wmode': 'transparent', 

全コード:

$(document).ready(function() { 
     $("#<%=FileUpload1.ClientID%>").uploadify({ 
      'uploader': 'scripts/uploadify.swf', 
      'script': 'Upload.ashx', 
      'cancelImg': 'images/cancel.png', 
      'buttonImg': 'images/create_album.png', 
      'width': '273', 
      'height': '51', 
      'wmode': 'transparent', 
      'folder': 'uploads', 
      'multi': true, 
      'auto': true, 
      'onAllComplete': function (event, queueID, fileObj, response, data) {      
      } 
     }); 

    });  
関連する問題