| 123456789101112131415161718192021222324252627282930313233343536373839404142 |
- <section id="resizer-options">
- <h1>Options</h1>
- <p>Use the options below to adjust resizer behavior.</p>
- <h2>Resizing strategy</h2>
- <p>
- <select name="strategy" id="strategy">
- <option value="center">Center</option>
- <option value="top-anchored" selected>Top-anchored center</option>
- <option value="side">Side</option>
- </select>
- </p>
- <h2>Visible resizers</h2>
- <ol>
- <li><input type="checkbox" name="handler[]" value="top-left" id="resizer-checkbox__top-left"> <label for="resizer-checkbox__top-left">top-left</label></li>
- <li><input type="checkbox" name="handler[]" value="top-right" id="resizer-checkbox__top-right"> <label for="resizer-checkbox__top-right">top-right</label></li>
- <li><input type="checkbox" name="handler[]" value="bottom-right" id="resizer-checkbox__bottom-right"> <label for="resizer-checkbox__bottom-right">bottom-right</label></li>
- <li><input type="checkbox" name="handler[]" value="bottom-left" id="resizer-checkbox__bottom-left"> <label for="resizer-checkbox__bottom-left">bottom-left</label></li>
- </ol>
- <p><input type="checkbox" name="resize-image" value="true" id="resize-image" checked> <label for="resize-image">Resize using image directly</label></p>
- </section>
- <div id="editor">
- <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla finibus consequat placerat. Vestibulum id tellus
- et mauris sagittis tincidunt quis id mauris. Curabitur consectetur lectus sit amet tellus mattis, non lobortis
- leo interdum. </p>
- <figure class="image image-style-side">
- <img src="sample.jpg" alt="" height="60" />
- </figure>
- <figure class="image">
- <img src="sample.jpg" alt="" />
- </figure>
- <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla finibus consequat placerat. Vestibulum id tellus
- et mauris sagittis tincidunt quis id mauris. Curabitur consectetur lectus sit amet tellus mattis, non lobortis
- leo interdum. </p>
- </div>
|