Yes, you can use images...
1) Place the appropriate image in the first (and only) sub-question text of the array. Do not place any other text there.
2) Add this slightly modified script in the source of the question text of the array. It will hide the existing header row of the array, insert a new header row and move the image up into that new row.
Code:
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
var columnCount = $('#question{QID} table.subquestions-list thead tr:eq(0) > *').length;
$('#question{QID} table.subquestions-list').addClass('custom-array-1');
$('#question{QID} table.subquestions-list thead thead tr:eq(0)').hide();
$('#question{QID} table.subquestions-list thead').append('<tr class="inserted-row"><td colspan='+columnCount+'></td></tr>');
$('#question{QID} table.subquestions-list .inserted-row td:eq(0)').html($('#question{QID} th.answertext:eq(0)').html());
$('#question{QID} th.answertext:eq(0)').html('');
});
</script>
3) Place these style rules at the end of
template.css. (these are for the default template so may need to be modified for others)
Code:
table.custom-array-1 {
width: 100%;
max-width: 1260px;
border: 1px solid #333333;
}
table.custom-array-1 .inserted-row td {
text-align: center;
padding: 0;
}
table.custom-array-1 .inserted-row img {
width: 100%;
}
table.custom-array-1 tr.array2:hover {
background-color: #EEEEEE;
}
table.custom-array-1 td.answer-item:hover {
background-color: #DDDDDD;
}
Here's a quick mock-up (you will, of course, need to tweak the image a bit).
? 
