TN8 Item Styleguide

Inline Choice - Cloze

Presentation Options

An inlineChoiceInteraction can have a "cloze" option. Specifying the cloze option is easy. You choose one of two different cloze classes, depending on the prefered presentation of the cloze blank (inline or block); e.g., clozeinline-<id of clozeblank>, or clozeblock-<id of clozeblank>.

If your clozeblank is going to be inline with some textual content, then you'll typically want to use the clozeinline option. If your cloze blank is placed on top of an image, then you'll want the clozeblock option. In the example below, the inlineChoice in the left column uses clozeinline, while the inlineChoice in the right column uses clozeblock to properly style the cloze blank over the top of the image.

Here are the QTI specifications for both inlineChoice's below:

<inlineChoiceInteraction class="clozeinline-foo clozeblank-width-100px" responseIdentifier="RESPONSE" shuffle="false">
<inlineChoiceInteraction class="clozeblock-sign clozeblank-width-60px" responseIdentifier="RESPONSE1" shuffle="false">

One other presentation option provides you with a mechanism to fine-tune a cloze blank's width. You use the clozeblank-width-<width>px class attribute. For example, we set the width of the first cloze blank to 100px in the item below by specifying clozeblank-width-100px in the class attribute.

Get Responses:[ Click Get Responses ]
Item XML 
<?xml version="1.0" encoding="utf-8"?>
<assessmentItem xmlns="http://www.imsglobal.org/xsd/imsqti_v2p1" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.imsglobal.org/xsd/imsqti_v2p1 http://www.imsglobal.org/xsd/imsqti_v2p1.xsd"
identifier="InlineChoice-cloze" title="Inline Choice - cloze" adaptive="false" timeDependent="false">
  <responseDeclaration identifier="RESPONSE" cardinality="single" baseType="identifier">
    <correctResponse>
      <value>Y</value>
    </correctResponse>
  </responseDeclaration>
  <responseDeclaration baseType="identifier" cardinality="single" identifier="RESPONSE1">
    <correctResponse>
  	  <value>Lu</value>
    </correctResponse>
  </responseDeclaration>
  <outcomeDeclaration identifier="SCORE" cardinality="single" baseType="float" />
  <itemBody>
    <div class="row">
      <div class="span6">
        <blockquote>
          <p>
            Now is the winter of our discontent<br />
            Made glorious summer by this sun of <span id="foo" />;<br />
            And all the clouds that lour'd upon our house<br />
            In the deep bosom of the ocean buried.
          </p>
        </blockquote>
        <p>
          Identify the missing word in this famous quote from Shakespeare's Richard III. 
          <inlineChoiceInteraction responseIdentifier="RESPONSE" 
            class="clozeinline-foo clozeblank-width-100px input-medium baseline" shuffle="false">
            <inlineChoice identifier="G">Gloucester</inlineChoice>
            <inlineChoice identifier="L">Lancaster</inlineChoice>
            <inlineChoice identifier="Y">York</inlineChoice>
          </inlineChoiceInteraction>;
        </p>
      </div>
      <div class="span6">
        <p>
          Select the missing word in the sign below:
          <inlineChoiceInteraction class="clozeblock-sign clozeblank-width-60px input-medium baseline" 
            responseIdentifier="RESPONSE1" shuffle="false">
            <inlineChoice identifier="L">Larry</inlineChoice>
            <inlineChoice identifier="M">Moe</inlineChoice>
            <inlineChoice identifier="C">Curly</inlineChoice>
            <inlineChoice identifier="Lu">Luggage</inlineChoice>
          </inlineChoiceInteraction>
        </p>
        <div style="position:relative;margin:0 auto;width:170px;">
          <img alt="Never Leave ________ Unattended" src="images/sign-cloze.png"/>
          <div id="sign" style="left:55px;top:36px;"/>
        </div>
      </div>
    </div>    
  </itemBody>
  <responseProcessing template="http://www.imsglobal.org/question/qti_v2p1/rptemplates/match_correct" />
</assessmentItem>

Now is the winter of our discontent
Made glorious summer by this sun of ;
And all the clouds that lour'd upon our house
In the deep bosom of the ocean buried.

Identify the missing word in this famous quote from Shakespeare's Richard III.

Select the missing word in the sign below:

Never Leave ________ Unattended