Hi, I have one more question.
I'm trying to design an IAT with two different categories.
For clarity I would like to display the lower categories in green. That alone works, but i don't know how i can display the corresponding words in the middle in green too. Is it even possible?
My code form the IAT workaround
Code:
// Insert IAT display
var iatTexts = $(thisQuestionHelp).text().split('||');
var iatDisplayHTML = '<div class="iatWrapper2">\
<div class="iatLeftLabel">'+iatTexts[0]+'</div>\
<div class="iatRightLabel">'+iatTexts[1]+'</div>\
<div class="iatWord2"></div>\
<div class="iatInstructions">'+iatTexts[2]+'</div>\
<div class="iatPlusrfarbig">'+iatTexts[3]+'</div>\
<div class="iatPlusl">'+iatTexts[4]+'</div>\
<div class="iatPlus1r">'+iatTexts[5]+'</div>\
<div class="iatPlus1lfarbig">'+iatTexts[6]+'</div>\
</div>\
<div class="iatMobileButtonWrapper">\
<div class="iatButton iatLeftButton">E</div>\
<div class="iatButton iatRightButton">I</div>\
<div style="width:100%; clear:both;"></div>\
</div>';
$(thisQuestionAnswers).prepend(iatDisplayHTML);
// Show a word
function iatShowWord() {
$('div.iatWord2', thisQuestion).text($('tr.subquestion-list.unanswered:first .answertext', thisQuestion).text());
startTime = new Date();
$(document).bind('keypress.iatKeypress', function(e) {
if(e.which == 101 || e.which == 105) {
var thisRow = $('tr.subquestion-list.unanswered:eq(0)', thisQuestion);
$(thisRow).removeClass('unanswered');
endTime = new Date();
$('input[type="text"]:eq(1)', thisRow).val(endTime.valueOf() - startTime.valueOf());
if(e.which == 101) {
$('input[type="text"]:eq(0)', thisRow).val('E');
}
else {
$('input[type="text"]:eq(0)', thisRow).val('I');
}
$(document).unbind('keypress.iatKeypress');
if($('tr.subquestion-list.unanswered', thisQuestion).length > 0) {
iatShowWord();
}
else {
$('.iatLeftLabel, .iatWord2, .iatRightLabel, .iatInstructions, .iatPlusrfarbig, .iatPlusl, .iatPlus1r, .iatPlus1lfarbig', thisQuestion).fadeOut('slow', function() {
$('div.iatWord2', thisQuestion).text(iatTexts[7]);
$('.iatWord2', thisQuestion).addClass('done').fadeIn('slow');
});
}
}
});
}
Thank you very much.