| /* | |
| * rem.js | |
| * v0.1.1 | |
| * fixed 2015-3-12 | |
| */ | |
| (function (win){ | |
| var doc = win.document, | |
| html = doc.documentElement, | |
| option = html.getAttribute('data-use-rem'); | |
| ;( function( $, window, document, undefined ) { | |
| 'use strict'; | |
| var s = document.body || document.documentElement, s = s.style; | |
| if ( s.webkitFlexWrap == '' || s.msFlexWrap == '' || s.flexWrap == '' ) return true; | |
| var $list = $( '.list' ), | |
| $items = $list.find( '.list__item__inner' ), | |
| setHeights = function() { | |
| $items.css( 'height', 'auto' ); |
| function hasClass(elem, className) { | |
| return new RegExp(' ' + className + ' ').test(' ' + elem.className + ' '); | |
| } | |
| function addClass(elem, className) { | |
| if (!hasClass(elem, className)) { | |
| elem.className += ' ' + className; | |
| } | |
| } |
| (function() { | |
| function DateDiff(date1, date2) { | |
| this.days = null; | |
| this.hours = null; | |
| this.minutes = null; | |
| this.seconds = null; | |
| this.date1 = date1; | |
| this.date2 = date2; |
All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.
elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParentelem.clientLeft, elem.clientTop, elem.clientWidth, elem.clientHeightelem.getClientRects(), elem.getBoundingClientRect()
| //单继承，浅复制 | |
| var extend = function(target, source) { | |
| for(var property in source) { | |
| traget[property] = source[property]; | |
| } | |
| return target; | |
| } | |
| //多继承，属性复制 |
| /////////////////////////////////////////////////////////// | |
| // Plain SASS Trigonometry Algorithm in Taylor Expansion // | |
| // // | |
| // Based on // | |
| // http://japborst.net/posts/sass-sines-and-cosines // | |
| /////////////////////////////////////////////////////////// | |
| $pi: 3.14159265359; | |
| $_precision: 10; |
| <!doctype html> | |
| <!-- http://taylor.fausak.me/2015/01/27/ios-8-web-apps/ --> | |
| <html> | |
| <head> | |
| <title>iOS 8 web app</title> | |
| <!-- CONFIGURATION --> |
| <div class='box'> | |
| border-radius only | |
| </div> |