forked from adeelejaz/jquery-image-resize
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathexample.html
48 lines (40 loc) · 1.85 KB
/
example.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<!doctype html>
<html>
<meta charset=utf-8>
<title>jQuery Resize Plugin Demo</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="jquery.ae.image.resize.min.js"></script>
<script>
$(function() {
$( ".resizeme" ).aeImageResize({ height: 250, width: 250 });
});
</script>
<h1>jQuery Resize Plugin Demo</h1>
<p><b>Author:</b> Adeel Ejaz (<a href="http://adeelejaz.com/">http://adeelejaz.com/</a>)
<p><b>License:</b> Dual licensed under <a href="http://www.opensource.org/licenses/mit-license.php">MIT</a> or <a href="http://www.opensource.org/licenses/gpl-license.php">GPL</a> licenses.
<h2>Introduction</h2>
<p>aeImageResize is a jQuery plugin to dynamically resize the images without distorting the proportions.
<h2>Usage:</h2>
<pre>.aeImageResize( height, width )</pre>
<p><code style="font-weight:bold">height</code> An integer representing the maximum height for the image.
<p><code style="font-weight:bold">width</code> An integer representing the maximum width for the image.
<h2>Example</h2>
<pre>$(function() {
$( ".resizeme" ).aeImageResize({ height: 250, width: 250 });
});</pre>
<ul>
<li>
<h3>Sample 1</h3>
<h4>Original</h4>
<img alt="Original Sample Image 1 - 400px x 300px" height=300 src="sample1.jpg" width=400>
<h4>Resized to 250px x 250px</h4>
<img alt="Resized Sample Image" class=resizeme height=300 src="sample1.jpg" width=400>
<li>
<h3>Sample 2</h3>
<h4>Original</h4>
<img alt="Original Sample Image 2 - 300px x 400px" height=400 src="sample2.jpg" width=300>
<h4>Resized to 250px x 250px</h4>
<img alt="Resized Sample Image" class=resizeme height=400 src="sample2.jpg" width=300>
</ul>
<h2>Other</h2>
<p>Sample images by <a href="http://www.freedigitalphotos.net/">FreeDigitalPhotos.net</a>.