| 1 |
- (function (root) { "use strict"; var css = ".nanobar{width:100%;height:4px;z-index:9999;top:0}.bar{width:0;height:100%;transition:height .3s;background:#000}"; function addCss() { var s = document.getElementById("nanobarcss"); if (s === null) { s = document.createElement("style"); s.type = "text/css"; s.id = "nanobarcss"; document.head.insertBefore(s, document.head.firstChild); if (!s.styleSheet) return s.appendChild(document.createTextNode(css)); s.styleSheet.cssText = css } } function addClass(el, cls) { if (el.classList) el.classList.add(cls); else el.className += " " + cls } function createBar(rm) { var el = document.createElement("div"), width = 0, here = 0, on = 0, bar = { el: el, go: go }; addClass(el, "bar"); function move() { var dist = width - here; if (dist < .1 && dist > -.1) { place(here); on = 0; if (width >= 100) { el.style.height = 0; setTimeout(function () { rm(el) }, 300) } } else { place(width - dist / 4); setTimeout(go, 16) } } function place(num) { width = num; el.style.width = width + "%" } function go(num) { if (num >= 0) { here = num; if (!on) { on = 1; move() } } else if (on) { move() } } return bar } function Nanobar(opts) { opts = opts || {}; var el = document.createElement("div"), applyGo, nanobar = { el: el, go: function (p) { applyGo(p); if (p >= 100) { init() } } }; function rm(child) { el.removeChild(child) } function init() { var bar = createBar(rm); el.appendChild(bar.el); applyGo = bar.go } addCss(); addClass(el, "nanobar"); if (opts.id) el.id = opts.id; if (opts.classname) addClass(el, opts.classname); if (opts.target) { el.style.position = "relative"; opts.target.insertBefore(el, opts.target.firstChild) } else { el.style.position = "fixed"; document.getElementsByTagName("body")[0].appendChild(el) } init(); return nanobar } if (typeof exports === "object") { module.exports = Nanobar } else if (typeof define === "function" && define.amd) { define([], function () { return Nanobar }) } else { root.Nanobar = Nanobar } })(this);
|
