javascript - change background-image to image file in html 5 -
javascript - change background-image to image file in html 5 -
i'm using html5 drag , drop image, code still running normally. but, can drop image background-image in dropbox, not image file. so, can't , insert image database. code:
script var holder = document.getelementbyid('leftbox'), state = document.getelementbyid('status'); if ( typeof window.filereader === 'undefined') { state.classname = 'fail'; } else { state.classname = 'success'; state.innerhtml = 'drop files here' } holder.ondragover = function() { this.classname = ''; homecoming false; }; holder.ondragend = function() { this.classname = ''; homecoming false; }; holder.ondrop = function(e) { this.classname = ''; e.preventdefault(); var file = e.datatransfer.files[0], reader = new filereader(); reader.onload = function(event) { console.log(event.target); holder.style.background = 'url(' + event.target.result + ') no-repeat center'; }; console.log(file); reader.readasdataurl(file); homecoming false; };
html <div class="medium-4 medium-centered columns"> <p id="status"></p> <div id="leftbox"></div> </div>
what should alter holder.style.background
image file? please help me :)
this should help you:
javascript onclick alter background image of div
$('#clickme').on('click', function() { $('#changeme').css('background-image', 'url(http://placehold.it/200x200/ff0000)'); })
javascript html html5 drag-and-drop
Comments
Post a Comment