image-orientation-cursor.html (983B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>CSS Images Module Level 3: image-orientation does apply to cursor</title> 4 <link rel="author" title="Cameron McCormack" href="mailto:cam@mcc.id.au"> 5 <link rel="help" href="https://drafts.csswg.org/css-images-3/#propdef-image-orientation"> 6 <link rel="flags" content="interact"> 7 <style> 8 div { width: 100px; height: 100px; border: solid blue; margin-left: 64px; } 9 .orient { cursor: url(support/cursor-8-llo.jpg) 33 0, default; } 10 .no-orient { cursor: url(support/cursor-8-llo.jpg) 64 33, default; image-orientation: none; } 11 </style> 12 <p>The test passes if</p> 13 <ul> 14 <li>when moved inside either of the blue boxes, the cursor is shown as a 15 black arrow on a white background, with the point of the arrow at the current 16 cursor location</li> 17 <li>in the first box, the cursor points up and to the right</li> 18 <li>in the second box, the cursor points down and to the right</li> 19 </ul> 20 <div class="orient"></div> 21 <div class="no-orient"></div>