| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>preserveAspectRatio test 1/2</title> | |
| <style> | |
| th { | |
| background-color: #dd9; | |
| font-family: sans-serif; | |
| } | |
| img, object { | |
| /* background-color: #EBF; */ | |
| border: 2px dashed maroon; | |
| height: 50px; | |
| left: 100px; | |
| overflow: visible; | |
| padding: 3px; | |
| top: 20px; | |
| width: 200px; | |
| box-sizing: border-box; | |
| } | |
| object { | |
| border-color: green; | |
| border-width: 1px; | |
| } | |
| </style> | |
| </head> | |
| <body onload="runRepaintTest()"> | |
| <table> | |
| <tr> | |
| <th> | |
| viewBox? | |
| </th> | |
| <th> | |
| preserve­Aspect­Ratio | |
| </th> | |
| <th> | |
| <img> | |
| </th> | |
| <th> | |
| <object> | |
| </th> | |
| </tr> | |
| <tr> | |
| <th rowspan=4> | |
| No viewBox | |
| </th> | |
| <th> | |
| </th> | |
| <td> | |
| <img src="../../as-image/resources/circle-default-default.svg" /> | |
| </td> | |
| <td> | |
| <object data="../../as-image/resources/circle-default-default.svg"></object> | |
| </td> | |
| </tr> | |
| <tr> | |
| <th> | |
| none | |
| </th> | |
| <td> | |
| <img src="../../as-image/resources/circle-default-none.svg" /> | |
| </td> | |
| <td> | |
| <object data="../../as-image/resources/circle-default-none.svg"></object> | |
| </td> | |
| </tr> | |
| <tr> | |
| <th> | |
| meet | |
| </th> | |
| <td> | |
| <img src="../../as-image/resources/circle-default-meet.svg" /> | |
| </td> | |
| <td> | |
| <object data="../../as-image/resources/circle-default-meet.svg"></object> | |
| </td> | |
| </tr> | |
| <tr> | |
| <th> | |
| slice | |
| </th> | |
| <td> | |
| <img src="../../as-image/resources/circle-default-slice.svg" /> | |
| </td> | |
| <td> | |
| <object data="../../as-image/resources/circle-default-slice.svg"></object> | |
| </td> | |
| </tr> | |
| <tr> | |
| <th rowspan=4> | |
| viewBox | |
| </th> | |
| <th> | |
| </th> | |
| <td> | |
| <img src="../../as-image/resources/circle-viewbox-default.svg" /> | |
| </td> | |
| <td> | |
| <object data="../../as-image/resources/circle-viewbox-default.svg"></object> | |
| </td> | |
| </tr> | |
| <tr> | |
| <th> | |
| none | |
| </th> | |
| <td> | |
| <img src="../../as-image/resources/circle-viewbox-none.svg" /> | |
| </td> | |
| <td> | |
| <object data="../../as-image/resources/circle-viewbox-none.svg"></object> | |
| </td> | |
| </tr> | |
| <tr> | |
| <th> | |
| meet | |
| </th> | |
| <td> | |
| <img src="../../as-image/resources/circle-viewbox-meet.svg" /> | |
| </td> | |
| <td> | |
| <object data="../../as-image/resources/circle-viewbox-meet.svg"></object> | |
| </td> | |
| </tr> | |
| <tr> | |
| <th> | |
| slice | |
| </th> | |
| <td> | |
| <img src="../../as-image/resources/circle-viewbox-slice.svg" /> | |
| </td> | |
| <td> | |
| <object data="../../as-image/resources/circle-viewbox-slice.svg"></object> | |
| </td> | |
| </tr> | |
| </table> | |
| <script>var zoomCount = 2; window.shouldZoomOut = true;</script> | |
| <script src="../../../fast/repaint/resources/repaint.js"></script> | |
| <script src="../resources/testPageZoom.js"></script> | |
| </body> | |
| </html> |