Upload example for a blog post.
authordino@apple.com <dino@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 6 Aug 2013 02:03:00 +0000 (02:03 +0000)
committerdino@apple.com <dino@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Tue, 6 Aug 2013 02:03:00 +0000 (02:03 +0000)
* blog-files/srcset/image-1x.png: Added.
* blog-files/srcset/image-2x.png: Added.
* blog-files/srcset/image-src.png: Added.
* blog-files/srcset/index.html: Added.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@153735 268f45cc-cd09-0410-ab3c-d52691b4dbfc

Websites/webkit.org/ChangeLog
Websites/webkit.org/blog-files/srcset/image-1x.png [new file with mode: 0644]
Websites/webkit.org/blog-files/srcset/image-2x.png [new file with mode: 0644]
Websites/webkit.org/blog-files/srcset/image-src.png [new file with mode: 0644]
Websites/webkit.org/blog-files/srcset/index.html [new file with mode: 0644]

index 9da60a0..0f54c54 100644 (file)
@@ -1,3 +1,12 @@
+2013-08-05  Dean Jackson  <dino@apple.com>
+
+        Upload example for a blog post.
+
+        * blog-files/srcset/image-1x.png: Added.
+        * blog-files/srcset/image-2x.png: Added.
+        * blog-files/srcset/image-src.png: Added.
+        * blog-files/srcset/index.html: Added.
+
 2013-07-31  Benjamin Poulain  <benjamin@webkit.org>
 
         Upload images for a potential blog post
diff --git a/Websites/webkit.org/blog-files/srcset/image-1x.png b/Websites/webkit.org/blog-files/srcset/image-1x.png
new file mode 100644 (file)
index 0000000..c8aea6f
Binary files /dev/null and b/Websites/webkit.org/blog-files/srcset/image-1x.png differ
diff --git a/Websites/webkit.org/blog-files/srcset/image-2x.png b/Websites/webkit.org/blog-files/srcset/image-2x.png
new file mode 100644 (file)
index 0000000..3cfb4bd
Binary files /dev/null and b/Websites/webkit.org/blog-files/srcset/image-2x.png differ
diff --git a/Websites/webkit.org/blog-files/srcset/image-src.png b/Websites/webkit.org/blog-files/srcset/image-src.png
new file mode 100644 (file)
index 0000000..ef36ac5
Binary files /dev/null and b/Websites/webkit.org/blog-files/srcset/image-src.png differ
diff --git a/Websites/webkit.org/blog-files/srcset/index.html b/Websites/webkit.org/blog-files/srcset/index.html
new file mode 100644 (file)
index 0000000..a08e8af
--- /dev/null
@@ -0,0 +1,62 @@
+<html>
+<head>
+  <title>Image srcset attribute example</title>
+  <style>
+  body {
+      font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif;
+      font-size: 120%;
+      line-height: 1.5;
+      margin: 2em 2em;
+      padding: 0;
+      background-color: #E2E6F5;
+  }
+
+  img {
+      width: 400px;
+      height: 400px;
+  }
+
+  pre {
+      padding: 1em 3em;
+      border: 1px solid #ccc;
+      background-color: #ddd;
+  }
+
+  p {
+      margin: 1em 0;
+  }
+
+  code {
+      font-size: 115%;
+      font-weight: bold;
+      color: #0F5426;
+  }
+  </style>
+</head>
+<body>
+
+<h1>
+    The <code>srcset</code> Attribute.
+</h1>
+
+<p>
+    Below is a image (<code>img</code>) element with both a regular <code>src</code> attribute
+    as well as a <code>srcset</code> attribute. There is a stylesheet that sets the dimensions
+    of images to 400x400px. On browsers without <code>srcset</code> support, the value of
+    the <code>src</code> attribute will be used as the image src [<a href="image-src.png">default image</a>].
+    On regular resolution displays, the 1x variant of the <code>srcset</code> will be used
+    [<a href="image-1x.png">1x image</a>]. On high resolution displays (at least 2 device pixels per CSS pixel),
+    the 2x variant of the <code>srcset</code> will be used [<a href="image-2x.png">2x image</a>].
+</p>
+
+<img src="image-src.png" srcset="image-1x.png 1x, image-2x.png 2x">
+
+<p>
+    The HTML for the above image is:
+</p>
+
+<pre>
+&lt;img src="image-src.png" srcset="image-1x.png 1x, image-2x.png 2x"&gt;
+</pre>
+</body>
+</html>