-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
62 lines (45 loc) · 2.66 KB
/
index.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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg">
<head>
<title>SVG in IE using VML</title>
<script type="text/javascript" src="iesvg.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script>
window.onload = function() {
apple = document.getElementById("appleObject");
}
function lol(e) {
$.get("apple2.svg", function(data) { apple.data = data })
}
function lulz() {
ieSVGInit();
}
</script>
</head>
<body style="position:absolute; z-index:0;" ondblclick="alert(document.documentElement.outerHTML);">
<h1><a href="#" onclick="lol()">SVG in IE</a></h1>
<h1><a href="#" onclick="lulz()">lulz</a></h1>
<object data="apple2.svg" type="image/svg+xml" width="600px" height="625px" id="appleObject"></object>
<svg:svg version="1.1" preserveAspectRatio="xMidYMid slice" style="width:100%; height:100%; position:absolute; top:0; left:0; z-index:-1;">
<svg:defs>
<svg:linearGradient id="lineargradient1">
<svg:stop offset="0" style="stop-color:red;stop-opacity:1.0000000;"/>
<svg:stop offset="1" style="stop-color:blue;stop-opacity:0.0000000;"/>
</svg:linearGradient>
<svg:linearGradient id="lineargradient2" gradientUnits="userSpaceOnUse" x1="450" y1="230" x2="570" y2="350">
<svg:stop offset="0%" style="stop-color:red;stop-opacity:1.0000000;"/>
<svg:stop offset="100%" style="stop-color:blue;stop-opacity:0.0000000;"/>
</svg:linearGradient>
</svg:defs>
<svg:ellipse id="n2" cx="60" cy="60" rx="50" ry="50" fill="red" />
<svg:rect id="n1" x="150" y="30" width="120" height="120" fill="yellow" />
<svg:rect id="n3" x="190" y="30" width="120" height="120" fill-opacity="0.5" />
<svg:rect id="n4" x="150" y="100" width="120" height="120" fill="none" stroke="blue" stroke-width="5px" stroke-opacity="0.5" />
<svg:circle id="n5" cx="90" cy="230" r="60" fill="green" stroke="silver" stroke-width="9px" />
<svg:polygon id="n6" fill="green" fill-opacity="0.5" stroke="blue" points="248,115 239,140 243,140 237,163 241,163 235,187 253,159 249,159 261,136 256,136 267,115" />
<svg:path id="n7" fill="green" stroke="blue" d="M 16,0 C 16,0 0,24 0,33 C 0,42 7,49 16,49 C 25,49 32,42 32,33 C 32,24 16,0 16,0" />
<svg:path id="n9" fill="green" stroke="blue" d="M 200,200 c 0,0 -16,24 -16,33 c 0,9 7,15 16,15 c 9,0 16,-7 16,-15 c 0,-9 -16,-33 -16,-33" />
<svg:rect id="n10" x="250" y="230" width="120" height="120" fill="url(#lineargradient1)" />
<svg:rect id="n11" x="450" y="230" width="120" height="120" fill="url(#lineargradient2)" />
</svg:svg>
</body>
</html>