Permalink
Browse files

fixed script position and gradients. broke box shadow for IE. still n…

…ot fixed
  • Loading branch information...
1 parent 0db6bd8 commit f98382631d5e53be5addcb854b7d3f815a3408f6 @paulirish paulirish committed Mar 26, 2010
Showing with 18 additions and 10 deletions.
  1. +9 −8 index.html
  2. +9 −2 javascript/javascript.js
View
@@ -4,13 +4,14 @@
<meta charset="UTF-8" />
<title>CSS3 Please! The Cross-Browser CSS3 Rule Generator</title>
<link rel="stylesheet" href="css/stylesheet.css" type="text/css" media="screen" />
-</head>
-<!-- its only up here because the js does syntax highlighting so i want the js loaded before the page loads. bad practice i know... -->
-<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
-<script src="javascript/jquery.plugins.min.js" type="text/javascript"></script>
-<script src="javascript/javascript.js" type="text/javascript"></script>
+ <!-- its only up here because the js does syntax highlighting so i want the js loaded before the page loads. bad practice i know... -->
+ <script src="javascript/jquery-1.4.2.js" type="text/javascript"></script>
+ <script src="javascript/jquery.plugins.min.js" type="text/javascript"></script>
+ <script src="javascript/javascript.js" type="text/javascript"></script>
+
+</head>
<body>
<div id="sandbox">
@@ -67,8 +68,8 @@
-moz-box-shadow: <b g="0">0px</b> <b g="1">0px</b> <b g="2">4px</b> <b g="3" i="s2Hex" o="sHex">#ffffff</b>; <span class="comment">/* FF3.5+ <span class="endcomment">*/</span></span>
-webkit-box-shadow: <b g="0">0px</b> <b g="1">0px</b> <b g="2">4px</b> <b g="3" i="s2Hex" o="sHex">#ffffff</b>; <span class="comment">/* Saf3.0+, Chrome <span class="endcomment">*/</span></span>
box-shadow: <b g="0">0px</b> <b g="1">0px</b> <b g="2">4px</b> <b g="3" i="s2Hex" o="sHex">#ffffff</b>; <span class="comment">/* Opera 10.5, IE 9.0 <span class="endcomment">*/</span></span>
- filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=<b g="0">0px</b>, OffY=<b g="1">0px</b>, Color='<b g="3" i="s2Hex" o="lHex">#ffffff</b>'); <span class="comment">/* IE6,IE7 <span class="endcomment">*/</span></span>
- -ms-filter: "progid:DXImageTransform.Microsoft.dropshadow(OffX=<b g="0">0px</b>, OffY=<b g="1">0px</b>, Color='<b g="3" i="s2Hex" o="lHex">#ffffff</b>')"; <span class="comment">/* IE8 <span class="endcomment">*/</span></span>
+ filter: progid:DXImageTransform.Microsoft.Shadow(Rotation=<b g="0" o="xy2rs" i="r2xy">135</b>, Strength=<b g="2">4</b>, Color='<b g="3" i="s2Hex" o="lHex">#ffffff</b>'); <span class="comment">/* IE6,IE7 <span class="endcomment">*/</span></span>
+ -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Rotation=<b g="0" o="xy2rs" i="r2xy">135</b>, Strength=<b g="2">4</b>, Color='<b g="3" i="s2Hex" o="lHex">#ffffff</b>')"; <span class="comment">/* IE8 <span class="endcomment">*/</span></span>
}
</pre>
<pre class="rule comment commentclose"><span class="comment">/* */</span></pre>
@@ -89,7 +90,7 @@
<pre class="rule">
.box_gradient {
background-image: -moz-linear-gradient(top, <b g="0" i="s2Hex">#444444</b>, <b g="1" i="s2Hex">#999999</b>); <span class="comment">/* FF3.6 <span class="endcomment">*/</span></span>
- background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, <b g="0" i="s2Hex">#444444</b>),color-stop(1, <b g="1" i="s2Hex">#999999</b>)); <span class="comment">/* Saf4+, Chrome <span class="endcomment">*/</span></span>
+ background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, <b g="0" i="s2Hex">#444444</b>),color-stop(1, <b g="1" i="s2Hex">#999999</b>)); <span class="comment">/* Saf4+, Chrome <span class="endcomment">*/</span></span>
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='<b g="0" i="s2Hex">#444444</b>', endColorstr='<b g="1" i="s2Hex">#999999</b>'); <span class="comment">/* IE6,IE7 <span class="endcomment">*/</span></span>
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='<b g="0" i="s2Hex">#444444</b>', endColorstr='<b g="1" i="s2Hex">#999999</b>')"; <span class="comment">/* IE8 <span class="endcomment">*/</span></span>
}
@@ -165,6 +165,13 @@ window.cssMath = {
},
rot: function (value, allValues) {
return cssMath.round(cssMath.d2r(value), 3);
+ },
+ xy2rs : function( value, allValues ,elem){
+ var children = $(elem).parent().parent().parent().find('b'),
+ x = parseInt(children.eq(0).text(),10),
+ y = parseInt(children.eq(1).text(),10);
+ console.log( elem, cssMath.xy2rs(x,y) );
+ return cssMath.xy2rs(x,y).r;
}
}
};
@@ -228,13 +235,13 @@ window.generator = {
itemValue = '';
if (input) {
- value = cssMath.eval[input](value, allValues);
+ value = cssMath.eval[input](value, allValues,elem);
}
while (++item < allValues.length) {
if (allValues[item].group == group) {
if (allValues[item].output) {
- itemValue = cssMath.eval[ allValues[item].output ](value, allValues);
+ itemValue = cssMath.eval[ allValues[item].output ](value, allValues, elem);
} else {
itemValue = value;
}

0 comments on commit f983826

Please sign in to comment.