##onepx
onepx is a javascript function to draw a retina 1px line without changing any css.
##How to use
<!--some elements with 1px border-->
<script src="onepx.js"></script>
<script>
onepx("*");
</script>##API
###onepx(selectors, [parentSelector][isListen]);
-
selectors：String, the selectors that need to be drew the retina 1px line, separated by commas. -
parentSelector：String, targets's parent selector, used to reduce the scope of observing, defaultbody -
isListen：Boolean, observe the element if true, when element added dynamically, check them if need to drew 1px
###More Examples Elements match ".item" will be drew
onepx(".item");
Elements match ".item" or ".box" will be drew
onepx(".item, .box");
Elements match ".item" which parents match ".list" will be drew
onepx(".item", ".list");
Elements match ".appendItem" will be drew, even they are added dynamically
onepx(".appendItem", true);
<li class="customItem" onepx=".customItem:acitve@border-color:blue&.customItem:hover@border-color:green"></li>The rule is: selector@custom style&selector@custom style&...
As onepx draw 1px line after the onepx.js loaded, it may cause page flicker.If you mind, you can do like this:
<body style="visibility:hidden;">
...
<script>
onepx(".item");
document.body.style.visibility = "visible";
</script>
</body>##DEMO
##License
onepx is available under the terms of the MIT License.