fancyupload java_FancyUpload3.0

官方网没有.net版本 只有php版 下面是.net版

css:

.swiff-uploader-box a{

display: none !important;

}

a:hover, a.hover{

color: red;

}

#demo-status{

padding: 10px 15px;

width: 420px;

border: 1px solid #eee;

}

#demo-status .progress{

background: url(img/progress.gif) no-repeat;

background-position: +50% 0;

margin-right: 0.5em;

vertical-align: middle;

}

#demo-status .progress-text{

font-size: 0.9em;

font-weight: bold;

}

#demo-list{

list-style: none;

width: 450px;

margin: 0;

}

#demo-list li.validation-error{

padding-left: 44px;

display: block;

clear: left;

line-height: 40px;

color: #8a1f11;

cursor: pointer;

border-bottom: 1px solid #fbc2c4;

background: #fbe3e4 url(img/failed.png) no-repeat 4px 4px;

}

#demo-list li.file{

border-bottom: 1px solid #eee;

background: url(img/file.png) no-repeat 4px 4px;

overflow: auto;

}

#demo-list li.file.file-uploading{

background-image: url(img/uploading.png);

background-color: #D9DDE9;

}

#demo-list li.file.file-success{

background-image: url(img/success.png);

}

#demo-list li.file.file-failed{

background-image: url(img/failed.png);

}

#demo-list li.file .file-name{

font-size: 1.2em;

margin-left: 44px;

display: block;

clear: left;

line-height: 40px;

height: 40px;

font-weight: bold;

}

#demo-list li.file .file-size{

font-size: 0.9em;

line-height: 18px;

float: right;

margin-top: 2px;

margin-right: 6px;

}

#demo-list li.file .file-info{

display: block;

margin-left: 44px;

font-size: 0.9em;

line-height: 20px;

clear}

#demo-list li.file .file-remove{

clear: right;

float: right;

line-height: 18px;

margin-right: 6px;

}

js:

window.addEvent('domready', function() {

varup = newFancyUpload2($('demo-status'), $('demo-list'), {

verbose: true,

url: $('form-demo').action,

path: 'js/Swiff.Uploader.swf',

typeFilter: {

'Images (*.jpg, *.jpeg, *.gif, *.png)': '*.jpg; *.jpeg; *.gif; *.png'},

target: 'demo-browse',

onLoad: function() {

$('demo-status').removeClass('hide');

$('demo-fallback').destroy();

this.target.addEvents({

click: function() {

return false;

},

mouseenter: function() {

this.addClass('hover');

},

mouseleave: function() {

this.removeClass('hover');

this.blur();

},

mousedown: function() {

this.focus();

}

});

$('demo-clear').addEvent('click', function() {

up.remove();

return false;

});

$('demo-upload').addEvent('click', function() {

up.start();

return false;

});

},

onSelectFail: function(files) {

files.each(function(file) {

newElement('li', {

'class': 'validation-error',

html: file.validationErrorMessage || file.validationError,

title: MooTools.lang.get('FancyUpload', 'removeTitle'),

events: {

click: function() {

this.destroy();

}

}

}).inject(this.list, 'top');

}, this);

},

onFileSuccess: function(file, response) {

varjson = newHash(JSON.decode(response, true) || {});

if(json.get('status') == '1') {

file.element.addClass('file-success');

file.info.set('html', 'Image was uploaded: '+ json.get('width') + ' x '+ json.get('height') + 'px, '+ json.get('mime') + ')');

} else{

file.element.addClass('file-failed');

file.info.set('html', 'An error occured: '+ (json.get('error') ? (json.get('error') + ' #'+ json.get('code')) : response));

}

},

onFail: function(error) {

switch(error) {

case'hidden':

alert('To enable the embedded uploader, unblock it in your browser and refresh (see Adblock).');

break;

case'blocked':

alert('To enable the embedded uploader, enable the blocked Flash movie (see Flashblock).');

break;

case'empty':

alert('A required file was not found, please be patient and we fix this.');

break;

case'flash':

alert('To enable the embedded uploader, install the latest Adobe Flash plugin.')

}

}

});

});

html:

File Upload

This form is just an example fallback for the unobtrusive behaviour of FancyUpload.

If this part is not changed, something must be wrong with your code.

Upload a Photo:

浏览|

清除列表|

上传