Archive for May, 2010

Jump Menu to open in new window

<script type=”text/javascript”>
function MM_jumpMenu(targ,selObj,restore){ //v3.0
eval(targ+”.location='”+selObj.options[selObj.selectedIndex].value+”‘”);
if (restore) selObj.selectedIndex=0;
}
</script>

<form name=”form” id=”form”>
<select name=”jumpMenu” id=”jumpMenu” onchange=”MM_jumpMenu(‘window.open()’,this,0)”>
<option value=”http://www.google.com”>Google</option&gt;
<option value=”http://www.yahoo.com”>Yahoo</option&gt;
<option value=”http://www.facebook.com”>Facebook</option&gt;
</select>
</form>

Advertisements

Border Radius

.border-radius {
-moz-border-radius:10px;
-webkit-border-radius:10px;
behaviour:url(border-radius.htc);
}

Download

IE Hack

IE-7 ONLY

* html #div {
height: 300px;
}

NON IE-7 ONLY:

#div {
_height: 300px;
}

Hide from IE 6 and LOWER:

#div {
height/**/: 300px;
}

html > body #div {
height: 300px;
}

pngfix IE6

hi,

This one is supported in IE6 and all browsers.

Download

Multiple backgrounds with CSS3

background: url(left.gif) top left no-repeat,
url(right.jpg)  top right no-repeat,
url(bottom_left.gif) left bottom no-repeat,
url(bottom-right.gif) right bottom no-repeat;

(css3 is not supported in all browser. Graceful degradation in folder browsers such as IE6 is highly recommended.)

3D text shadow with CSS3

.shadow {text-shadow:1px 1px 0px #000, 2px 2px 0px #000,
3px 3px  0px #000, 4px 4px 0px #000,
5px 5px 0px #000, 6px 6px 0px #000,
7px 7px  0px #000, 8px 8px 0px #000,
9px 9px 0px #000, 10px 10px 0px #000;}


CSS3 Tips & Tricks

(css3 is not supported in all browser. Graceful degradation in folder browsers such as IE6 is highly
recommended.)

Rotate Div with CSS3

.rotate{
-webkit-transform: rotate(-45deg);
-moz-transform:  rotate(-45deg);
}

(css3 is not supported in all browser. Graceful degradation in folder browsers such as IE6 is highly
recommended.)