I've been trying to adjust the width of a div element when the window is resized, but for some reason, the width always ends up being 0 after the resize event.
function resizeUploadField() {
var uploadInputField = $('.input-append');
var uploadSelectButton = $('.btn-file');
var uploadRemoveButton = $('.fileupload-exists');
if (uploadRemoveButton.length) {
}
console.log(uploadInputField.width());
uploadInputField.width(uploadInputField.width() - uploadSelectButton.outerWidth() - 2);
console.log(uploadInputField.width());
}
$(document).ready(function() {
var windowWidth = $(window).width();
resizeUploadField();
$(window).resize(function(event) {
console.log($(event.target).width());
if ($(event.target).width() != windowWidth) {
resizeUploadField();
windowWidth = $(event.target).width();
}
});
It seems like the resizeUploadField function is working fine because the field resizes correctly when called in onDocumentReady.
If anyone can provide insight into what might be causing this issue, I would greatly appreciate it!