layerjs-gm-with-css

layer.js 带有css样式

As of 2021-10-27. See the latest version.

This script should not be not be installed directly. It is a library for other scripts to include with the meta directive // @require https://update.greatest.deepsurf.us/scripts/434540/982908/layerjs-gm-with-css.js

  1. // ==UserScript==
  2. // @name layerjs-gm-with-css
  3. // @author aweleey.li
  4. // @version 1.0.0
  5. // @grant GM_addStyle
  6. // @note layer - 通用 Web 弹出层组件
  7. // @note MIT Licensed
  8. // ==/UserScript==
  9.  
  10. AddLayerStyle();
  11.  
  12. !(function (window, undefined) {
  13. 'use strict';
  14. var addedByGM = true;
  15.  
  16. var isLayui = window.layui && layui.define,
  17. $,
  18. win,
  19. ready = {
  20. getPath: (function () {
  21. if (addedByGM) return '';
  22. var jsPath = document.currentScript
  23. ? document.currentScript.src
  24. : (function () {
  25. var js = document.scripts,
  26. last = js.length - 1,
  27. src;
  28. for (var i = last; i > 0; i--) {
  29. if (js[i].readyState === 'interactive') {
  30. src = js[i].src;
  31. break;
  32. }
  33. }
  34. return src || js[last].src;
  35. })(),
  36. GLOBAL = window.LAYUI_GLOBAL || {};
  37. return GLOBAL.layer_dir || jsPath.substring(0, jsPath.lastIndexOf('/') + 1);
  38. })(),
  39.  
  40. config: {},
  41. end: {},
  42. minIndex: 0,
  43. minLeft: [],
  44. btn: ['确定', '取消'],
  45.  
  46. //五种原始层模式
  47. type: ['dialog', 'page', 'iframe', 'loading', 'tips'],
  48.  
  49. //获取节点的style属性值
  50. getStyle: function (node, name) {
  51. var style = node.currentStyle ? node.currentStyle : window.getComputedStyle(node, null);
  52. return style[style.getPropertyValue ? 'getPropertyValue' : 'getAttribute'](name);
  53. },
  54.  
  55. //载入 CSS 依赖
  56. link: function (href, fn, cssname) {
  57. console.log('layer lsakdfjslakdf', layer);
  58. //未设置路径,则不主动加载css
  59. if (!layer.path) return;
  60.  
  61. var head = document.getElementsByTagName('head')[0],
  62. link = document.createElement('link');
  63.  
  64. if (typeof fn === 'string') cssname = fn;
  65.  
  66. var app = (cssname || href).replace(/\.|\//g, '');
  67. var id = 'layuicss-' + app,
  68. STAUTS_NAME = 'creating',
  69. timeout = 0;
  70.  
  71. link.rel = 'stylesheet';
  72. link.href = layer.path + href;
  73. link.id = id;
  74.  
  75. if (!document.getElementById(id)) {
  76. head.appendChild(link);
  77. }
  78.  
  79. if (typeof fn !== 'function') return;
  80.  
  81. //轮询 css 是否加载完毕
  82. (function poll(status) {
  83. var delay = 100,
  84. getLinkElem = document.getElementById(id); //获取动态插入的 link 元素
  85.  
  86. //如果轮询超过指定秒数,则视为请求文件失败或 css 文件不符合规范
  87. if (++timeout > (10 * 1000) / delay) {
  88. return window.console && console.error(app + '.css: Invalid');
  89. }
  90.  
  91. //css 加载就绪
  92. if (parseInt(ready.getStyle(getLinkElem, 'width')) === 1989) {
  93. //如果参数来自于初始轮询(即未加载就绪时的),则移除 link 标签状态
  94. if (status === STAUTS_NAME) getLinkElem.removeAttribute('lay-status');
  95. //如果 link 标签的状态仍为「创建中」,则继续进入轮询,直到状态改变,则执行回调
  96. getLinkElem.getAttribute('lay-status') === STAUTS_NAME ? setTimeout(poll, delay) : fn();
  97. } else {
  98. getLinkElem.setAttribute('lay-status', STAUTS_NAME);
  99. setTimeout(function () {
  100. poll(STAUTS_NAME);
  101. }, delay);
  102. }
  103.  
  104. //parseInt(ready.getStyle(document.getElementById(id), 'width')) === 1989 ? fn() : setTimeout(poll, 1000);
  105. })();
  106. }
  107. };
  108.  
  109. //默认内置方法。
  110. var layer = {
  111. v: '3.5.1',
  112. ie: (function () {
  113. //ie版本
  114. var agent = navigator.userAgent.toLowerCase();
  115. return !!window.ActiveXObject || 'ActiveXObject' in window
  116. ? (agent.match(/msie\s(\d+)/) || [])[1] || '11' //由于ie11并没有msie的标识
  117. : false;
  118. })(),
  119. index: window.layer && window.layer.v ? 100000 : 0,
  120. path: ready.getPath,
  121. config: function (options, fn) {
  122. options = options || {};
  123. layer.cache = ready.config = $.extend({}, ready.config, options);
  124. layer.path = ready.config.path || layer.path;
  125. typeof options.extend === 'string' && (options.extend = [options.extend]);
  126.  
  127. //如果设置了路径,则加载样式
  128. if (ready.config.path) layer.ready();
  129.  
  130. if (!options.extend) return this;
  131.  
  132. isLayui ? layui.addcss('modules/layer/' + options.extend) : ready.link('theme/' + options.extend);
  133.  
  134. return this;
  135. },
  136.  
  137. //主体CSS等待事件
  138. ready: function (callback) {
  139. var cssname = 'layer',
  140. ver = '',
  141. path = (isLayui ? 'modules/layer/' : 'theme/') + 'default/layer.css?v=' + layer.v + ver;
  142. isLayui ? layui.addcss(path, callback, cssname) : ready.link(path, callback, cssname);
  143. return this;
  144. },
  145.  
  146. //各种快捷引用
  147. alert: function (content, options, yes) {
  148. var type = typeof options === 'function';
  149. if (type) yes = options;
  150. return layer.open(
  151. $.extend(
  152. {
  153. content: content,
  154. yes: yes
  155. },
  156. type ? {} : options
  157. )
  158. );
  159. },
  160.  
  161. confirm: function (content, options, yes, cancel) {
  162. var type = typeof options === 'function';
  163. if (type) {
  164. cancel = yes;
  165. yes = options;
  166. }
  167. return layer.open(
  168. $.extend(
  169. {
  170. content: content,
  171. btn: ready.btn,
  172. yes: yes,
  173. btn2: cancel
  174. },
  175. type ? {} : options
  176. )
  177. );
  178. },
  179.  
  180. msg: function (content, options, end) {
  181. //最常用提示层
  182. var type = typeof options === 'function',
  183. rskin = ready.config.skin;
  184. var skin = (rskin ? rskin + ' ' + rskin + '-msg' : '') || 'layui-layer-msg';
  185. var anim = doms.anim.length - 1;
  186. if (type) end = options;
  187. return layer.open(
  188. $.extend(
  189. {
  190. content: content,
  191. time: 3000,
  192. shade: false,
  193. skin: skin,
  194. title: false,
  195. closeBtn: false,
  196. btn: false,
  197. resize: false,
  198. end: end
  199. },
  200. type && !ready.config.skin
  201. ? {
  202. skin: skin + ' layui-layer-hui',
  203. anim: anim
  204. }
  205. : (function () {
  206. options = options || {};
  207. if (options.icon === -1 || (options.icon === undefined && !ready.config.skin)) {
  208. options.skin = skin + ' ' + (options.skin || 'layui-layer-hui');
  209. }
  210. return options;
  211. })()
  212. )
  213. );
  214. },
  215.  
  216. load: function (icon, options) {
  217. return layer.open(
  218. $.extend(
  219. {
  220. type: 3,
  221. icon: icon || 0,
  222. resize: false,
  223. shade: 0.01
  224. },
  225. options
  226. )
  227. );
  228. },
  229.  
  230. tips: function (content, follow, options) {
  231. return layer.open(
  232. $.extend(
  233. {
  234. type: 4,
  235. content: [content, follow],
  236. closeBtn: false,
  237. time: 3000,
  238. shade: false,
  239. resize: false,
  240. fixed: false,
  241. maxWidth: 260
  242. },
  243. options
  244. )
  245. );
  246. }
  247. };
  248.  
  249. var Class = function (setings) {
  250. var that = this,
  251. creat = function () {
  252. that.creat();
  253. };
  254. that.index = ++layer.index;
  255. that.config.maxWidth = $(win).width() - 15 * 2; //初始最大宽度:当前屏幕宽,左右留 15px 边距
  256. that.config = $.extend({}, that.config, ready.config, setings);
  257. document.body
  258. ? creat()
  259. : setTimeout(function () {
  260. creat();
  261. }, 30);
  262. };
  263.  
  264. Class.pt = Class.prototype;
  265.  
  266. //缓存常用字符
  267. var doms = [
  268. 'layui-layer',
  269. '.layui-layer-title',
  270. '.layui-layer-main',
  271. '.layui-layer-dialog',
  272. 'layui-layer-iframe',
  273. 'layui-layer-content',
  274. 'layui-layer-btn',
  275. 'layui-layer-close'
  276. ];
  277. doms.anim = ['layer-anim-00', 'layer-anim-01', 'layer-anim-02', 'layer-anim-03', 'layer-anim-04', 'layer-anim-05', 'layer-anim-06'];
  278.  
  279. doms.SHADE = 'layui-layer-shade';
  280. doms.MOVE = 'layui-layer-move';
  281.  
  282. //默认配置
  283. Class.pt.config = {
  284. type: 0,
  285. shade: 0.3,
  286. fixed: true,
  287. move: doms[1],
  288. title: '信息',
  289. offset: 'auto',
  290. area: 'auto',
  291. closeBtn: 1,
  292. time: 0, //0表示不自动关闭
  293. zIndex: 19891014,
  294. maxWidth: 360,
  295. anim: 0,
  296. isOutAnim: true, //退出动画
  297. minStack: true, //最小化堆叠
  298. icon: -1,
  299. moveType: 1,
  300. resize: true,
  301. scrollbar: true, //是否允许浏览器滚动条
  302. tips: 2
  303. };
  304.  
  305. //容器
  306. Class.pt.vessel = function (conType, callback) {
  307. var that = this,
  308. times = that.index,
  309. config = that.config;
  310. var zIndex = config.zIndex + times,
  311. titype = typeof config.title === 'object';
  312. var ismax = config.maxmin && (config.type === 1 || config.type === 2);
  313. var titleHTML = config.title
  314. ? '<div class="layui-layer-title" style="' +
  315. (titype ? config.title[1] : '') +
  316. '">' +
  317. (titype ? config.title[0] : config.title) +
  318. '</div>'
  319. : '';
  320.  
  321. config.zIndex = zIndex;
  322. callback(
  323. [
  324. //遮罩
  325. config.shade
  326. ? '<div class="' +
  327. doms.SHADE +
  328. '" id="' +
  329. doms.SHADE +
  330. times +
  331. '" times="' +
  332. times +
  333. '" style="' +
  334. ('z-index:' + (zIndex - 1) + '; ') +
  335. '"></div>'
  336. : '',
  337.  
  338. //主体
  339. '<div class="' +
  340. doms[0] +
  341. (' layui-layer-' + ready.type[config.type]) +
  342. ((config.type == 0 || config.type == 2) && !config.shade ? ' layui-layer-border' : '') +
  343. ' ' +
  344. (config.skin || '') +
  345. '" id="' +
  346. doms[0] +
  347. times +
  348. '" type="' +
  349. ready.type[config.type] +
  350. '" times="' +
  351. times +
  352. '" showtime="' +
  353. config.time +
  354. '" conType="' +
  355. (conType ? 'object' : 'string') +
  356. '" style="z-index: ' +
  357. zIndex +
  358. '; width:' +
  359. config.area[0] +
  360. ';height:' +
  361. config.area[1] +
  362. ';position:' +
  363. (config.fixed ? 'fixed;' : 'absolute;') +
  364. '">' +
  365. (conType && config.type != 2 ? '' : titleHTML) +
  366. '<div id="' +
  367. (config.id || '') +
  368. '" class="layui-layer-content' +
  369. (config.type == 0 && config.icon !== -1 ? ' layui-layer-padding' : '') +
  370. (config.type == 3 ? ' layui-layer-loading' + config.icon : '') +
  371. '">' +
  372. (config.type == 0 && config.icon !== -1 ? '<i class="layui-layer-ico layui-layer-ico' + config.icon + '"></i>' : '') +
  373. (config.type == 1 && conType ? '' : config.content || '') +
  374. '</div>' +
  375. '<span class="layui-layer-setwin">' +
  376. (function () {
  377. var closebtn = ismax
  378. ? '<a class="layui-layer-min" href="javascript:;"><cite></cite></a><a class="layui-layer-ico layui-layer-max" href="javascript:;"></a>'
  379. : '';
  380. config.closeBtn &&
  381. (closebtn +=
  382. '<a class="layui-layer-ico ' +
  383. doms[7] +
  384. ' ' +
  385. doms[7] +
  386. (config.title ? config.closeBtn : config.type == 4 ? '1' : '2') +
  387. '" href="javascript:;"></a>');
  388. return closebtn;
  389. })() +
  390. '</span>' +
  391. (config.btn
  392. ? (function () {
  393. var button = '';
  394. typeof config.btn === 'string' && (config.btn = [config.btn]);
  395. for (var i = 0, len = config.btn.length; i < len; i++) {
  396. button += '<a class="' + doms[6] + '' + i + '">' + config.btn[i] + '</a>';
  397. }
  398. return '<div class="' + doms[6] + ' layui-layer-btn-' + (config.btnAlign || '') + '">' + button + '</div>';
  399. })()
  400. : '') +
  401. (config.resize ? '<span class="layui-layer-resize"></span>' : '') +
  402. '</div>'
  403. ],
  404. titleHTML,
  405. $('<div class="' + doms.MOVE + '" id="' + doms.MOVE + '"></div>')
  406. );
  407. return that;
  408. };
  409.  
  410. //创建骨架
  411. Class.pt.creat = function () {
  412. var that = this,
  413. config = that.config,
  414. times = that.index,
  415. nodeIndex,
  416. content = config.content,
  417. conType = typeof content === 'object',
  418. body = $('body');
  419.  
  420. if (config.id && $('#' + config.id)[0]) return;
  421.  
  422. if (typeof config.area === 'string') {
  423. config.area = config.area === 'auto' ? ['', ''] : [config.area, ''];
  424. }
  425.  
  426. //anim兼容旧版shift
  427. if (config.shift) {
  428. config.anim = config.shift;
  429. }
  430.  
  431. if (layer.ie == 6) {
  432. config.fixed = false;
  433. }
  434.  
  435. switch (config.type) {
  436. case 0:
  437. config.btn = 'btn' in config ? config.btn : ready.btn[0];
  438. layer.closeAll('dialog');
  439. break;
  440. case 2:
  441. var content = (config.content = conType ? config.content : [config.content || '', 'auto']);
  442. config.content =
  443. '<iframe scrolling="' +
  444. (config.content[1] || 'auto') +
  445. '" allowtransparency="true" id="' +
  446. doms[4] +
  447. '' +
  448. times +
  449. '" name="' +
  450. doms[4] +
  451. '' +
  452. times +
  453. '" onload="this.className=\'\';" class="layui-layer-load" frameborder="0" src="' +
  454. config.content[0] +
  455. '"></iframe>';
  456. break;
  457. case 3:
  458. delete config.title;
  459. delete config.closeBtn;
  460. config.icon === -1 && config.icon === 0;
  461. layer.closeAll('loading');
  462. break;
  463. case 4:
  464. conType || (config.content = [config.content, 'body']);
  465. config.follow = config.content[1];
  466. config.content = config.content[0] + '<i class="layui-layer-TipsG"></i>';
  467. delete config.title;
  468. config.tips = typeof config.tips === 'object' ? config.tips : [config.tips, true];
  469. config.tipsMore || layer.closeAll('tips');
  470. break;
  471. }
  472.  
  473. //建立容器
  474. that.vessel(conType, function (html, titleHTML, moveElem) {
  475. body.append(html[0]);
  476. conType
  477. ? (function () {
  478. config.type == 2 || config.type == 4
  479. ? (function () {
  480. $('body').append(html[1]);
  481. })()
  482. : (function () {
  483. if (!content.parents('.' + doms[0])[0]) {
  484. content.data('display', content.css('display')).show().addClass('layui-layer-wrap').wrap(html[1]);
  485. $('#' + doms[0] + times)
  486. .find('.' + doms[5])
  487. .before(titleHTML);
  488. }
  489. })();
  490. })()
  491. : body.append(html[1]);
  492. $('#' + doms.MOVE)[0] || body.append((ready.moveElem = moveElem));
  493.  
  494. that.layero = $('#' + doms[0] + times);
  495. that.shadeo = $('#' + doms.SHADE + times);
  496.  
  497. config.scrollbar || doms.html.css('overflow', 'hidden').attr('layer-full', times);
  498. }).auto(times);
  499.  
  500. //遮罩
  501. that.shadeo.css({
  502. 'background-color': config.shade[1] || '#000',
  503. opacity: config.shade[0] || config.shade
  504. });
  505.  
  506. config.type == 2 && layer.ie == 6 && that.layero.find('iframe').attr('src', content[0]);
  507.  
  508. //坐标自适应浏览器窗口尺寸
  509. config.type == 4
  510. ? that.tips()
  511. : (function () {
  512. that.offset();
  513. //首次弹出时,若 css 尚未加载,则等待 css 加载完毕后,重新设定尺寸
  514. parseInt(ready.getStyle(document.getElementById(doms.MOVE), 'z-index')) ||
  515. (function () {
  516. that.layero.css('visibility', 'hidden');
  517. layer.ready(function () {
  518. that.offset();
  519. that.layero.css('visibility', 'visible');
  520. });
  521. })();
  522. })();
  523.  
  524. //如果是固定定位
  525. if (config.fixed) {
  526. win.on('resize', function () {
  527. that.offset();
  528. (/^\d+%$/.test(config.area[0]) || /^\d+%$/.test(config.area[1])) && that.auto(times);
  529. config.type == 4 && that.tips();
  530. });
  531. }
  532.  
  533. config.time <= 0 ||
  534. setTimeout(function () {
  535. layer.close(that.index);
  536. }, config.time);
  537. that.move().callback();
  538.  
  539. //为兼容jQuery3.0的css动画影响元素尺寸计算
  540. if (doms.anim[config.anim]) {
  541. var animClass = 'layer-anim ' + doms.anim[config.anim];
  542. that.layero.addClass(animClass).one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function () {
  543. $(this).removeClass(animClass);
  544. });
  545. }
  546.  
  547. //记录关闭动画
  548. if (config.isOutAnim) {
  549. that.layero.data('isOutAnim', true);
  550. }
  551. };
  552.  
  553. //自适应
  554. Class.pt.auto = function (index) {
  555. var that = this,
  556. config = that.config,
  557. layero = $('#' + doms[0] + index);
  558.  
  559. if (config.area[0] === '' && config.maxWidth > 0) {
  560. //为了修复IE7下一个让人难以理解的bug
  561. if (layer.ie && layer.ie < 8 && config.btn) {
  562. layero.width(layero.innerWidth());
  563. }
  564. layero.outerWidth() > config.maxWidth && layero.width(config.maxWidth);
  565. }
  566.  
  567. var area = [layero.innerWidth(), layero.innerHeight()],
  568. titHeight = layero.find(doms[1]).outerHeight() || 0,
  569. btnHeight = layero.find('.' + doms[6]).outerHeight() || 0,
  570. setHeight = function (elem) {
  571. elem = layero.find(elem);
  572. elem.height(area[1] - titHeight - btnHeight - 2 * (parseFloat(elem.css('padding-top')) | 0));
  573. };
  574.  
  575. switch (config.type) {
  576. case 2:
  577. setHeight('iframe');
  578. break;
  579. default:
  580. if (config.area[1] === '') {
  581. if (config.maxHeight > 0 && layero.outerHeight() > config.maxHeight) {
  582. area[1] = config.maxHeight;
  583. setHeight('.' + doms[5]);
  584. } else if (config.fixed && area[1] >= win.height()) {
  585. area[1] = win.height();
  586. setHeight('.' + doms[5]);
  587. }
  588. } else {
  589. setHeight('.' + doms[5]);
  590. }
  591. break;
  592. }
  593.  
  594. return that;
  595. };
  596.  
  597. //计算坐标
  598. Class.pt.offset = function () {
  599. var that = this,
  600. config = that.config,
  601. layero = that.layero;
  602. var area = [layero.outerWidth(), layero.outerHeight()];
  603. var type = typeof config.offset === 'object';
  604. that.offsetTop = (win.height() - area[1]) / 2;
  605. that.offsetLeft = (win.width() - area[0]) / 2;
  606.  
  607. if (type) {
  608. that.offsetTop = config.offset[0];
  609. that.offsetLeft = config.offset[1] || that.offsetLeft;
  610. } else if (config.offset !== 'auto') {
  611. if (config.offset === 't') {
  612. //上
  613. that.offsetTop = 0;
  614. } else if (config.offset === 'r') {
  615. //右
  616. that.offsetLeft = win.width() - area[0];
  617. } else if (config.offset === 'b') {
  618. //下
  619. that.offsetTop = win.height() - area[1];
  620. } else if (config.offset === 'l') {
  621. //左
  622. that.offsetLeft = 0;
  623. } else if (config.offset === 'lt') {
  624. //左上角
  625. that.offsetTop = 0;
  626. that.offsetLeft = 0;
  627. } else if (config.offset === 'lb') {
  628. //左下角
  629. that.offsetTop = win.height() - area[1];
  630. that.offsetLeft = 0;
  631. } else if (config.offset === 'rt') {
  632. //右上角
  633. that.offsetTop = 0;
  634. that.offsetLeft = win.width() - area[0];
  635. } else if (config.offset === 'rb') {
  636. //右下角
  637. that.offsetTop = win.height() - area[1];
  638. that.offsetLeft = win.width() - area[0];
  639. } else {
  640. that.offsetTop = config.offset;
  641. }
  642. }
  643.  
  644. if (!config.fixed) {
  645. that.offsetTop = /%$/.test(that.offsetTop) ? (win.height() * parseFloat(that.offsetTop)) / 100 : parseFloat(that.offsetTop);
  646. that.offsetLeft = /%$/.test(that.offsetLeft) ? (win.width() * parseFloat(that.offsetLeft)) / 100 : parseFloat(that.offsetLeft);
  647. that.offsetTop += win.scrollTop();
  648. that.offsetLeft += win.scrollLeft();
  649. }
  650.  
  651. if (layero.attr('minLeft')) {
  652. that.offsetTop = win.height() - (layero.find(doms[1]).outerHeight() || 0);
  653. that.offsetLeft = layero.css('left');
  654. }
  655.  
  656. layero.css({ top: that.offsetTop, left: that.offsetLeft });
  657. };
  658.  
  659. //Tips
  660. Class.pt.tips = function () {
  661. var that = this,
  662. config = that.config,
  663. layero = that.layero;
  664. var layArea = [layero.outerWidth(), layero.outerHeight()],
  665. follow = $(config.follow);
  666. if (!follow[0]) follow = $('body');
  667. var goal = {
  668. width: follow.outerWidth(),
  669. height: follow.outerHeight(),
  670. top: follow.offset().top,
  671. left: follow.offset().left
  672. },
  673. tipsG = layero.find('.layui-layer-TipsG');
  674.  
  675. var guide = config.tips[0];
  676. config.tips[1] || tipsG.remove();
  677.  
  678. goal.autoLeft = function () {
  679. if (goal.left + layArea[0] - win.width() > 0) {
  680. goal.tipLeft = goal.left + goal.width - layArea[0];
  681. tipsG.css({ right: 12, left: 'auto' });
  682. } else {
  683. goal.tipLeft = goal.left;
  684. }
  685. };
  686.  
  687. //辨别tips的方位
  688. goal.where = [
  689. function () {
  690. //上
  691. goal.autoLeft();
  692. goal.tipTop = goal.top - layArea[1] - 10;
  693. tipsG.removeClass('layui-layer-TipsB').addClass('layui-layer-TipsT').css('border-right-color', config.tips[1]);
  694. },
  695. function () {
  696. //右
  697. goal.tipLeft = goal.left + goal.width + 10;
  698. goal.tipTop = goal.top;
  699. tipsG.removeClass('layui-layer-TipsL').addClass('layui-layer-TipsR').css('border-bottom-color', config.tips[1]);
  700. },
  701. function () {
  702. //下
  703. goal.autoLeft();
  704. goal.tipTop = goal.top + goal.height + 10;
  705. tipsG.removeClass('layui-layer-TipsT').addClass('layui-layer-TipsB').css('border-right-color', config.tips[1]);
  706. },
  707. function () {
  708. //左
  709. goal.tipLeft = goal.left - layArea[0] - 10;
  710. goal.tipTop = goal.top;
  711. tipsG.removeClass('layui-layer-TipsR').addClass('layui-layer-TipsL').css('border-bottom-color', config.tips[1]);
  712. }
  713. ];
  714. goal.where[guide - 1]();
  715.  
  716. /* 8*2为小三角形占据的空间 */
  717. if (guide === 1) {
  718. goal.top - (win.scrollTop() + layArea[1] + 8 * 2) < 0 && goal.where[2]();
  719. } else if (guide === 2) {
  720. win.width() - (goal.left + goal.width + layArea[0] + 8 * 2) > 0 || goal.where[3]();
  721. } else if (guide === 3) {
  722. goal.top - win.scrollTop() + goal.height + layArea[1] + 8 * 2 - win.height() > 0 && goal.where[0]();
  723. } else if (guide === 4) {
  724. layArea[0] + 8 * 2 - goal.left > 0 && goal.where[1]();
  725. }
  726.  
  727. layero.find('.' + doms[5]).css({
  728. 'background-color': config.tips[1],
  729. 'padding-right': config.closeBtn ? '30px' : ''
  730. });
  731. layero.css({
  732. left: goal.tipLeft - (config.fixed ? win.scrollLeft() : 0),
  733. top: goal.tipTop - (config.fixed ? win.scrollTop() : 0)
  734. });
  735. };
  736.  
  737. //拖拽层
  738. Class.pt.move = function () {
  739. var that = this,
  740. config = that.config,
  741. _DOC = $(document),
  742. layero = that.layero,
  743. moveElem = layero.find(config.move),
  744. resizeElem = layero.find('.layui-layer-resize'),
  745. dict = {};
  746.  
  747. if (config.move) {
  748. moveElem.css('cursor', 'move');
  749. }
  750.  
  751. moveElem.on('mousedown', function (e) {
  752. e.preventDefault();
  753. if (config.move) {
  754. dict.moveStart = true;
  755. dict.offset = [e.clientX - parseFloat(layero.css('left')), e.clientY - parseFloat(layero.css('top'))];
  756. ready.moveElem.css('cursor', 'move').show();
  757. }
  758. });
  759.  
  760. resizeElem.on('mousedown', function (e) {
  761. e.preventDefault();
  762. dict.resizeStart = true;
  763. dict.offset = [e.clientX, e.clientY];
  764. dict.area = [layero.outerWidth(), layero.outerHeight()];
  765. ready.moveElem.css('cursor', 'se-resize').show();
  766. });
  767.  
  768. _DOC.on('mousemove', function (e) {
  769. //拖拽移动
  770. if (dict.moveStart) {
  771. var X = e.clientX - dict.offset[0],
  772. Y = e.clientY - dict.offset[1],
  773. fixed = layero.css('position') === 'fixed';
  774.  
  775. e.preventDefault();
  776.  
  777. dict.stX = fixed ? 0 : win.scrollLeft();
  778. dict.stY = fixed ? 0 : win.scrollTop();
  779.  
  780. //控制元素不被拖出窗口外
  781. if (!config.moveOut) {
  782. var setRig = win.width() - layero.outerWidth() + dict.stX,
  783. setBot = win.height() - layero.outerHeight() + dict.stY;
  784. X < dict.stX && (X = dict.stX);
  785. X > setRig && (X = setRig);
  786. Y < dict.stY && (Y = dict.stY);
  787. Y > setBot && (Y = setBot);
  788. }
  789.  
  790. layero.css({
  791. left: X,
  792. top: Y
  793. });
  794. }
  795.  
  796. //Resize
  797. if (config.resize && dict.resizeStart) {
  798. var X = e.clientX - dict.offset[0],
  799. Y = e.clientY - dict.offset[1];
  800.  
  801. e.preventDefault();
  802.  
  803. layer.style(that.index, {
  804. width: dict.area[0] + X,
  805. height: dict.area[1] + Y
  806. });
  807. dict.isResize = true;
  808. config.resizing && config.resizing(layero);
  809. }
  810. }).on('mouseup', function (e) {
  811. if (dict.moveStart) {
  812. delete dict.moveStart;
  813. ready.moveElem.hide();
  814. config.moveEnd && config.moveEnd(layero);
  815. }
  816. if (dict.resizeStart) {
  817. delete dict.resizeStart;
  818. ready.moveElem.hide();
  819. }
  820. });
  821.  
  822. return that;
  823. };
  824.  
  825. Class.pt.callback = function () {
  826. var that = this,
  827. layero = that.layero,
  828. config = that.config;
  829. that.openLayer();
  830. if (config.success) {
  831. if (config.type == 2) {
  832. layero.find('iframe').on('load', function () {
  833. config.success(layero, that.index);
  834. });
  835. } else {
  836. config.success(layero, that.index);
  837. }
  838. }
  839. layer.ie == 6 && that.IE6(layero);
  840.  
  841. //按钮
  842. layero
  843. .find('.' + doms[6])
  844. .children('a')
  845. .on('click', function () {
  846. var index = $(this).index();
  847. if (index === 0) {
  848. if (config.yes) {
  849. config.yes(that.index, layero);
  850. } else if (config['btn1']) {
  851. config['btn1'](that.index, layero);
  852. } else {
  853. layer.close(that.index);
  854. }
  855. } else {
  856. var close = config['btn' + (index + 1)] && config['btn' + (index + 1)](that.index, layero);
  857. close === false || layer.close(that.index);
  858. }
  859. });
  860.  
  861. //取消
  862. function cancel() {
  863. var close = config.cancel && config.cancel(that.index, layero);
  864. close === false || layer.close(that.index);
  865. }
  866.  
  867. //右上角关闭回调
  868. layero.find('.' + doms[7]).on('click', cancel);
  869.  
  870. //点遮罩关闭
  871. if (config.shadeClose) {
  872. that.shadeo.on('click', function () {
  873. layer.close(that.index);
  874. });
  875. }
  876.  
  877. //最小化
  878. layero.find('.layui-layer-min').on('click', function () {
  879. var min = config.min && config.min(layero, that.index);
  880. min === false || layer.min(that.index, config);
  881. });
  882.  
  883. //全屏/还原
  884. layero.find('.layui-layer-max').on('click', function () {
  885. if ($(this).hasClass('layui-layer-maxmin')) {
  886. layer.restore(that.index);
  887. config.restore && config.restore(layero, that.index);
  888. } else {
  889. layer.full(that.index, config);
  890. setTimeout(function () {
  891. config.full && config.full(layero, that.index);
  892. }, 100);
  893. }
  894. });
  895.  
  896. config.end && (ready.end[that.index] = config.end);
  897. };
  898.  
  899. //for ie6 恢复select
  900. ready.reselect = function () {
  901. $.each($('select'), function (index, value) {
  902. var sthis = $(this);
  903. if (!sthis.parents('.' + doms[0])[0]) {
  904. sthis.attr('layer') == 1 && $('.' + doms[0]).length < 1 && sthis.removeAttr('layer').show();
  905. }
  906. sthis = null;
  907. });
  908. };
  909.  
  910. Class.pt.IE6 = function (layero) {
  911. //隐藏select
  912. $('select').each(function (index, value) {
  913. var sthis = $(this);
  914. if (!sthis.parents('.' + doms[0])[0]) {
  915. sthis.css('display') === 'none' || sthis.attr({ layer: '1' }).hide();
  916. }
  917. sthis = null;
  918. });
  919. };
  920.  
  921. //需依赖原型的对外方法
  922. Class.pt.openLayer = function () {
  923. var that = this;
  924.  
  925. //置顶当前窗口
  926. layer.zIndex = that.config.zIndex;
  927. layer.setTop = function (layero) {
  928. var setZindex = function () {
  929. layer.zIndex++;
  930. layero.css('z-index', layer.zIndex + 1);
  931. };
  932. layer.zIndex = parseInt(layero[0].style.zIndex);
  933. layero.on('mousedown', setZindex);
  934. return layer.zIndex;
  935. };
  936. };
  937.  
  938. //记录宽高坐标,用于还原
  939. ready.record = function (layero) {
  940. var area = [layero.width(), layero.height(), layero.position().top, layero.position().left + parseFloat(layero.css('margin-left'))];
  941. layero.find('.layui-layer-max').addClass('layui-layer-maxmin');
  942. layero.attr({ area: area });
  943. };
  944.  
  945. ready.rescollbar = function (index) {
  946. if (doms.html.attr('layer-full') == index) {
  947. if (doms.html[0].style.removeProperty) {
  948. doms.html[0].style.removeProperty('overflow');
  949. } else {
  950. doms.html[0].style.removeAttribute('overflow');
  951. }
  952. doms.html.removeAttr('layer-full');
  953. }
  954. };
  955.  
  956. /** 内置成员 */
  957.  
  958. window.layer = layer;
  959. console.log('window.layer', window.layer);
  960.  
  961. //获取子iframe的DOM
  962. layer.getChildFrame = function (selector, index) {
  963. index = index || $('.' + doms[4]).attr('times');
  964. return $('#' + doms[0] + index)
  965. .find('iframe')
  966. .contents()
  967. .find(selector);
  968. };
  969.  
  970. //得到当前iframe层的索引,子iframe时使用
  971. layer.getFrameIndex = function (name) {
  972. return $('#' + name)
  973. .parents('.' + doms[4])
  974. .attr('times');
  975. };
  976.  
  977. //iframe层自适应宽高
  978. layer.iframeAuto = function (index) {
  979. if (!index) return;
  980. var heg = layer.getChildFrame('html', index).outerHeight();
  981. var layero = $('#' + doms[0] + index);
  982. var titHeight = layero.find(doms[1]).outerHeight() || 0;
  983. var btnHeight = layero.find('.' + doms[6]).outerHeight() || 0;
  984. layero.css({ height: heg + titHeight + btnHeight });
  985. layero.find('iframe').css({ height: heg });
  986. };
  987.  
  988. //重置iframe url
  989. layer.iframeSrc = function (index, url) {
  990. $('#' + doms[0] + index)
  991. .find('iframe')
  992. .attr('src', url);
  993. };
  994.  
  995. //设定层的样式
  996. layer.style = function (index, options, limit) {
  997. var layero = $('#' + doms[0] + index),
  998. contElem = layero.find('.layui-layer-content'),
  999. type = layero.attr('type'),
  1000. titHeight = layero.find(doms[1]).outerHeight() || 0,
  1001. btnHeight = layero.find('.' + doms[6]).outerHeight() || 0,
  1002. minLeft = layero.attr('minLeft');
  1003.  
  1004. if (type === ready.type[3] || type === ready.type[4]) {
  1005. return;
  1006. }
  1007.  
  1008. if (!limit) {
  1009. if (parseFloat(options.width) <= 260) {
  1010. options.width = 260;
  1011. }
  1012.  
  1013. if (parseFloat(options.height) - titHeight - btnHeight <= 64) {
  1014. options.height = 64 + titHeight + btnHeight;
  1015. }
  1016. }
  1017.  
  1018. layero.css(options);
  1019. btnHeight = layero.find('.' + doms[6]).outerHeight();
  1020.  
  1021. if (type === ready.type[2]) {
  1022. layero.find('iframe').css({
  1023. height: parseFloat(options.height) - titHeight - btnHeight
  1024. });
  1025. } else {
  1026. contElem.css({
  1027. height:
  1028. parseFloat(options.height) -
  1029. titHeight -
  1030. btnHeight -
  1031. parseFloat(contElem.css('padding-top')) -
  1032. parseFloat(contElem.css('padding-bottom'))
  1033. });
  1034. }
  1035. };
  1036.  
  1037. //最小化
  1038. layer.min = function (index, options) {
  1039. options = options || {};
  1040. var layero = $('#' + doms[0] + index),
  1041. shadeo = $('#' + doms.SHADE + index),
  1042. titHeight = layero.find(doms[1]).outerHeight() || 0,
  1043. left = layero.attr('minLeft') || 181 * ready.minIndex + 'px',
  1044. position = layero.css('position'),
  1045. settings = {
  1046. width: 180,
  1047. height: titHeight,
  1048. position: 'fixed',
  1049. overflow: 'hidden'
  1050. };
  1051.  
  1052. //记录宽高坐标,用于还原
  1053. ready.record(layero);
  1054.  
  1055. if (ready.minLeft[0]) {
  1056. left = ready.minLeft[0];
  1057. ready.minLeft.shift();
  1058. }
  1059.  
  1060. //是否堆叠在左下角
  1061. if (options.minStack) {
  1062. settings.left = left;
  1063. settings.top = win.height() - titHeight;
  1064. layero.attr('minLeft') || ready.minIndex++; //初次执行,最小化操作索引自增
  1065. layero.attr('minLeft', left);
  1066. }
  1067.  
  1068. layero.attr('position', position);
  1069. layer.style(index, settings, true);
  1070.  
  1071. layero.find('.layui-layer-min').hide();
  1072. layero.attr('type') === 'page' && layero.find(doms[4]).hide();
  1073. ready.rescollbar(index);
  1074.  
  1075. //隐藏遮罩
  1076. shadeo.hide();
  1077. };
  1078.  
  1079. //还原
  1080. layer.restore = function (index) {
  1081. var layero = $('#' + doms[0] + index),
  1082. shadeo = $('#' + doms.SHADE + index),
  1083. area = layero.attr('area').split(','),
  1084. type = layero.attr('type');
  1085.  
  1086. //恢复原来尺寸
  1087. layer.style(
  1088. index,
  1089. {
  1090. width: parseFloat(area[0]),
  1091. height: parseFloat(area[1]),
  1092. top: parseFloat(area[2]),
  1093. left: parseFloat(area[3]),
  1094. position: layero.attr('position'),
  1095. overflow: 'visible'
  1096. },
  1097. true
  1098. );
  1099.  
  1100. layero.find('.layui-layer-max').removeClass('layui-layer-maxmin');
  1101. layero.find('.layui-layer-min').show();
  1102. layero.attr('type') === 'page' && layero.find(doms[4]).show();
  1103. ready.rescollbar(index);
  1104.  
  1105. //恢复遮罩
  1106. shadeo.show();
  1107. };
  1108.  
  1109. //全屏
  1110. layer.full = function (index) {
  1111. var layero = $('#' + doms[0] + index),
  1112. timer;
  1113. ready.record(layero);
  1114. if (!doms.html.attr('layer-full')) {
  1115. doms.html.css('overflow', 'hidden').attr('layer-full', index);
  1116. }
  1117. clearTimeout(timer);
  1118. timer = setTimeout(function () {
  1119. var isfix = layero.css('position') === 'fixed';
  1120. layer.style(
  1121. index,
  1122. {
  1123. top: isfix ? 0 : win.scrollTop(),
  1124. left: isfix ? 0 : win.scrollLeft(),
  1125. width: win.width(),
  1126. height: win.height()
  1127. },
  1128. true
  1129. );
  1130. layero.find('.layui-layer-min').hide();
  1131. }, 100);
  1132. };
  1133.  
  1134. //改变title
  1135. layer.title = function (name, index) {
  1136. var title = $('#' + doms[0] + (index || layer.index)).find(doms[1]);
  1137. title.html(name);
  1138. };
  1139.  
  1140. //关闭layer总方法
  1141. layer.close = function (index, callback) {
  1142. var layero = $('#' + doms[0] + index),
  1143. type = layero.attr('type'),
  1144. closeAnim = 'layer-anim-close';
  1145. if (!layero[0]) return;
  1146. var WRAP = 'layui-layer-wrap',
  1147. remove = function () {
  1148. if (type === ready.type[1] && layero.attr('conType') === 'object') {
  1149. layero.children(':not(.' + doms[5] + ')').remove();
  1150. var wrap = layero.find('.' + WRAP);
  1151. for (var i = 0; i < 2; i++) {
  1152. wrap.unwrap();
  1153. }
  1154. wrap.css('display', wrap.data('display')).removeClass(WRAP);
  1155. } else {
  1156. //低版本IE 回收 iframe
  1157. if (type === ready.type[2]) {
  1158. try {
  1159. var iframe = $('#' + doms[4] + index)[0];
  1160. iframe.contentWindow.document.write('');
  1161. iframe.contentWindow.close();
  1162. layero.find('.' + doms[5])[0].removeChild(iframe);
  1163. } catch (e) {}
  1164. }
  1165. layero[0].innerHTML = '';
  1166. layero.remove();
  1167. }
  1168. typeof ready.end[index] === 'function' && ready.end[index]();
  1169. delete ready.end[index];
  1170. typeof callback === 'function' && callback();
  1171. };
  1172.  
  1173. if (layero.data('isOutAnim')) {
  1174. layero.addClass('layer-anim ' + closeAnim);
  1175. }
  1176.  
  1177. $('#layui-layer-moves, #' + doms.SHADE + index).remove();
  1178. layer.ie == 6 && ready.reselect();
  1179. ready.rescollbar(index);
  1180. if (layero.attr('minLeft')) {
  1181. ready.minIndex--;
  1182. ready.minLeft.push(layero.attr('minLeft'));
  1183. }
  1184.  
  1185. if ((layer.ie && layer.ie < 10) || !layero.data('isOutAnim')) {
  1186. remove();
  1187. } else {
  1188. setTimeout(function () {
  1189. remove();
  1190. }, 200);
  1191. }
  1192. };
  1193.  
  1194. //关闭所有层
  1195. layer.closeAll = function (type, callback) {
  1196. if (typeof type === 'function') {
  1197. callback = type;
  1198. type = null;
  1199. }
  1200. var domsElem = $('.' + doms[0]);
  1201. $.each(domsElem, function (_index) {
  1202. var othis = $(this);
  1203. var is = type ? othis.attr('type') === type : 1;
  1204. is && layer.close(othis.attr('times'), _index === domsElem.length - 1 ? callback : null);
  1205. is = null;
  1206. });
  1207. if (domsElem.length === 0) typeof callback === 'function' && callback();
  1208. };
  1209.  
  1210. /**
  1211.  
  1212. 拓展模块,layui 开始合并在一起
  1213.  
  1214. */
  1215.  
  1216. var cache = layer.cache || {},
  1217. skin = function (type) {
  1218. return cache.skin ? ' ' + cache.skin + ' ' + cache.skin + '-' + type : '';
  1219. };
  1220.  
  1221. //仿系统prompt
  1222. layer.prompt = function (options, yes) {
  1223. var style = '';
  1224. options = options || {};
  1225.  
  1226. if (typeof options === 'function') yes = options;
  1227.  
  1228. if (options.area) {
  1229. var area = options.area;
  1230. style = 'style="width: ' + area[0] + '; height: ' + area[1] + ';"';
  1231. delete options.area;
  1232. }
  1233. var prompt,
  1234. content =
  1235. options.formType == 2
  1236. ? '<textarea class="layui-layer-input"' + style + '></textarea>'
  1237. : (function () {
  1238. return '<input type="' + (options.formType == 1 ? 'password' : 'text') + '" class="layui-layer-input">';
  1239. })();
  1240.  
  1241. var success = options.success;
  1242. delete options.success;
  1243.  
  1244. return layer.open(
  1245. $.extend(
  1246. {
  1247. type: 1,
  1248. btn: ['&#x786E;&#x5B9A;', '&#x53D6;&#x6D88;'],
  1249. content: content,
  1250. skin: 'layui-layer-prompt' + skin('prompt'),
  1251. maxWidth: win.width(),
  1252. success: function (layero) {
  1253. prompt = layero.find('.layui-layer-input');
  1254. prompt.val(options.value || '').focus();
  1255. typeof success === 'function' && success(layero);
  1256. },
  1257. resize: false,
  1258. yes: function (index) {
  1259. var value = prompt.val();
  1260. if (value === '') {
  1261. prompt.focus();
  1262. } else if (value.length > (options.maxlength || 500)) {
  1263. layer.tips('&#x6700;&#x591A;&#x8F93;&#x5165;' + (options.maxlength || 500) + '&#x4E2A;&#x5B57;&#x6570;', prompt, {
  1264. tips: 1
  1265. });
  1266. } else {
  1267. yes && yes(value, index, prompt);
  1268. }
  1269. }
  1270. },
  1271. options
  1272. )
  1273. );
  1274. };
  1275.  
  1276. //tab层
  1277. layer.tab = function (options) {
  1278. options = options || {};
  1279.  
  1280. var tab = options.tab || {},
  1281. THIS = 'layui-this',
  1282. success = options.success;
  1283.  
  1284. delete options.success;
  1285.  
  1286. return layer.open(
  1287. $.extend(
  1288. {
  1289. type: 1,
  1290. skin: 'layui-layer-tab' + skin('tab'),
  1291. resize: false,
  1292. title: (function () {
  1293. var len = tab.length,
  1294. ii = 1,
  1295. str = '';
  1296. if (len > 0) {
  1297. str = '<span class="' + THIS + '">' + tab[0].title + '</span>';
  1298. for (; ii < len; ii++) {
  1299. str += '<span>' + tab[ii].title + '</span>';
  1300. }
  1301. }
  1302. return str;
  1303. })(),
  1304. content:
  1305. '<ul class="layui-layer-tabmain">' +
  1306. (function () {
  1307. var len = tab.length,
  1308. ii = 1,
  1309. str = '';
  1310. if (len > 0) {
  1311. str = '<li class="layui-layer-tabli ' + THIS + '">' + (tab[0].content || 'no content') + '</li>';
  1312. for (; ii < len; ii++) {
  1313. str += '<li class="layui-layer-tabli">' + (tab[ii].content || 'no content') + '</li>';
  1314. }
  1315. }
  1316. return str;
  1317. })() +
  1318. '</ul>',
  1319. success: function (layero) {
  1320. var btn = layero.find('.layui-layer-title').children();
  1321. var main = layero.find('.layui-layer-tabmain').children();
  1322. btn.on('mousedown', function (e) {
  1323. e.stopPropagation ? e.stopPropagation() : (e.cancelBubble = true);
  1324. var othis = $(this),
  1325. index = othis.index();
  1326. othis.addClass(THIS).siblings().removeClass(THIS);
  1327. main.eq(index).show().siblings().hide();
  1328. typeof options.change === 'function' && options.change(index);
  1329. });
  1330. typeof success === 'function' && success(layero);
  1331. }
  1332. },
  1333. options
  1334. )
  1335. );
  1336. };
  1337.  
  1338. //相册层
  1339. layer.photos = function (options, loop, key) {
  1340. var dict = {};
  1341. options = options || {};
  1342. if (!options.photos) return;
  1343.  
  1344. //若 photos 并非选择器或 jQuery 对象,则为普通 object
  1345. var isObject = !(typeof options.photos === 'string' || options.photos instanceof $),
  1346. photos = isObject ? options.photos : {},
  1347. data = photos.data || [],
  1348. start = photos.start || 0;
  1349.  
  1350. dict.imgIndex = (start | 0) + 1;
  1351. options.img = options.img || 'img';
  1352.  
  1353. var success = options.success;
  1354. delete options.success;
  1355.  
  1356. //如果 options.photos 不是一个对象
  1357. if (!isObject) {
  1358. //页面直接获取
  1359. var parent = $(options.photos),
  1360. pushData = function () {
  1361. data = [];
  1362. parent.find(options.img).each(function (index) {
  1363. var othis = $(this);
  1364. othis.attr('layer-index', index);
  1365. data.push({
  1366. alt: othis.attr('alt'),
  1367. pid: othis.attr('layer-pid'),
  1368. src: othis.attr('layer-src') || othis.attr('src'),
  1369. thumb: othis.attr('src')
  1370. });
  1371. });
  1372. };
  1373.  
  1374. pushData();
  1375.  
  1376. if (data.length === 0) return;
  1377.  
  1378. loop ||
  1379. parent.on('click', options.img, function () {
  1380. pushData();
  1381. var othis = $(this),
  1382. index = othis.attr('layer-index');
  1383. layer.photos(
  1384. $.extend(options, {
  1385. photos: {
  1386. start: index,
  1387. data: data,
  1388. tab: options.tab
  1389. },
  1390. full: options.full
  1391. }),
  1392. true
  1393. );
  1394. });
  1395.  
  1396. //不直接弹出
  1397. if (!loop) return;
  1398. } else if (data.length === 0) {
  1399. return layer.msg('&#x6CA1;&#x6709;&#x56FE;&#x7247;');
  1400. }
  1401.  
  1402. //上一张
  1403. dict.imgprev = function (key) {
  1404. dict.imgIndex--;
  1405. if (dict.imgIndex < 1) {
  1406. dict.imgIndex = data.length;
  1407. }
  1408. dict.tabimg(key);
  1409. };
  1410.  
  1411. //下一张
  1412. dict.imgnext = function (key, errorMsg) {
  1413. dict.imgIndex++;
  1414. if (dict.imgIndex > data.length) {
  1415. dict.imgIndex = 1;
  1416. if (errorMsg) {
  1417. return;
  1418. }
  1419. }
  1420. dict.tabimg(key);
  1421. };
  1422.  
  1423. //方向键
  1424. dict.keyup = function (event) {
  1425. if (!dict.end) {
  1426. var code = event.keyCode;
  1427. event.preventDefault();
  1428. if (code === 37) {
  1429. dict.imgprev(true);
  1430. } else if (code === 39) {
  1431. dict.imgnext(true);
  1432. } else if (code === 27) {
  1433. layer.close(dict.index);
  1434. }
  1435. }
  1436. };
  1437.  
  1438. //切换
  1439. dict.tabimg = function (key) {
  1440. if (data.length <= 1) return;
  1441. photos.start = dict.imgIndex - 1;
  1442. layer.close(dict.index);
  1443. return layer.photos(options, true, key);
  1444. setTimeout(function () {
  1445. layer.photos(options, true, key);
  1446. }, 200);
  1447. };
  1448.  
  1449. //一些动作
  1450. dict.event = function () {
  1451. /*
  1452. dict.bigimg.hover(function(){
  1453. dict.imgsee.show();
  1454. }, function(){
  1455. dict.imgsee.hide();
  1456. });
  1457. */
  1458.  
  1459. dict.bigimg.find('.layui-layer-imgprev').on('click', function (event) {
  1460. event.preventDefault();
  1461. dict.imgprev(true);
  1462. });
  1463.  
  1464. dict.bigimg.find('.layui-layer-imgnext').on('click', function (event) {
  1465. event.preventDefault();
  1466. dict.imgnext(true);
  1467. });
  1468.  
  1469. $(document).on('keyup', dict.keyup);
  1470. };
  1471.  
  1472. //图片预加载
  1473. function loadImage(url, callback, error) {
  1474. var img = new Image();
  1475. img.src = url;
  1476. if (img.complete) {
  1477. return callback(img);
  1478. }
  1479. img.onload = function () {
  1480. img.onload = null;
  1481. callback(img);
  1482. };
  1483. img.onerror = function (e) {
  1484. img.onerror = null;
  1485. error(e);
  1486. };
  1487. }
  1488.  
  1489. dict.loadi = layer.load(1, {
  1490. shade: 'shade' in options ? false : 0.9,
  1491. scrollbar: false
  1492. });
  1493.  
  1494. loadImage(
  1495. data[start].src,
  1496. function (img) {
  1497. layer.close(dict.loadi);
  1498.  
  1499. //切换图片时不出现动画
  1500. if (key) options.anim = -1;
  1501.  
  1502. //弹出图片层
  1503. dict.index = layer.open(
  1504. $.extend(
  1505. {
  1506. type: 1,
  1507. id: 'layui-layer-photos',
  1508. area: (function () {
  1509. var imgarea = [img.width, img.height];
  1510. var winarea = [$(window).width() - 100, $(window).height() - 100];
  1511.  
  1512. //如果 实际图片的宽或者高比 屏幕大(那么进行缩放)
  1513. if (!options.full && (imgarea[0] > winarea[0] || imgarea[1] > winarea[1])) {
  1514. var wh = [imgarea[0] / winarea[0], imgarea[1] / winarea[1]]; //取宽度缩放比例、高度缩放比例
  1515. if (wh[0] > wh[1]) {
  1516. //取缩放比例最大的进行缩放
  1517. imgarea[0] = imgarea[0] / wh[0];
  1518. imgarea[1] = imgarea[1] / wh[0];
  1519. } else if (wh[0] < wh[1]) {
  1520. imgarea[0] = imgarea[0] / wh[1];
  1521. imgarea[1] = imgarea[1] / wh[1];
  1522. }
  1523. }
  1524.  
  1525. return [imgarea[0] + 'px', imgarea[1] + 'px'];
  1526. })(),
  1527. title: false,
  1528. shade: 0.9,
  1529. shadeClose: true,
  1530. closeBtn: false,
  1531. move: '.layui-layer-phimg img',
  1532. moveType: 1,
  1533. scrollbar: false,
  1534. moveOut: true,
  1535. anim: 5,
  1536. isOutAnim: false,
  1537. skin: 'layui-layer-photos' + skin('photos'),
  1538. content:
  1539. '<div class="layui-layer-phimg">' +
  1540. '<img src="' +
  1541. data[start].src +
  1542. '" alt="' +
  1543. (data[start].alt || '') +
  1544. '" layer-pid="' +
  1545. data[start].pid +
  1546. '">' +
  1547. (function () {
  1548. if (data.length > 1) {
  1549. return (
  1550. '<div class="layui-layer-imgsee">' +
  1551. '<span class="layui-layer-imguide"><a href="javascript:;" class="layui-layer-iconext layui-layer-imgprev"></a><a href="javascript:;" class="layui-layer-iconext layui-layer-imgnext"></a></span>' +
  1552. '<div class="layui-layer-imgbar" style="display:' +
  1553. (key ? 'block' : '') +
  1554. '"><span class="layui-layer-imgtit"><a href="javascript:;">' +
  1555. (data[start].alt || '') +
  1556. '</a><em>' +
  1557. dict.imgIndex +
  1558. ' / ' +
  1559. data.length +
  1560. '</em></span></div>' +
  1561. '</div>'
  1562. );
  1563. }
  1564. return '';
  1565. })() +
  1566. '</div>',
  1567. success: function (layero, index) {
  1568. dict.bigimg = layero.find('.layui-layer-phimg');
  1569. dict.imgsee = layero.find('.layui-layer-imgbar');
  1570. dict.event(layero);
  1571. options.tab && options.tab(data[start], layero);
  1572. typeof success === 'function' && success(layero);
  1573. },
  1574. end: function () {
  1575. dict.end = true;
  1576. $(document).off('keyup', dict.keyup);
  1577. }
  1578. },
  1579. options
  1580. )
  1581. );
  1582. },
  1583. function () {
  1584. layer.close(dict.loadi);
  1585. layer.msg(
  1586. '&#x5F53;&#x524D;&#x56FE;&#x7247;&#x5730;&#x5740;&#x5F02;&#x5E38;<br>&#x662F;&#x5426;&#x7EE7;&#x7EED;&#x67E5;&#x770B;&#x4E0B;&#x4E00;&#x5F20;&#xFF1F;',
  1587. {
  1588. time: 30000,
  1589. btn: ['&#x4E0B;&#x4E00;&#x5F20;', '&#x4E0D;&#x770B;&#x4E86;'],
  1590. yes: function () {
  1591. data.length > 1 && dict.imgnext(true, true);
  1592. }
  1593. }
  1594. );
  1595. }
  1596. );
  1597. };
  1598.  
  1599. //主入口
  1600. ready.run = function (_$) {
  1601. $ = _$;
  1602. win = $(window);
  1603. doms.html = $('html');
  1604. layer.open = function (deliver) {
  1605. var o = new Class(deliver);
  1606. return o.index;
  1607. };
  1608. };
  1609.  
  1610. //加载方式
  1611. window.layui && layui.define
  1612. ? (layer.ready(),
  1613. layui.define('jquery', function (exports) {
  1614. //layui 加载
  1615. layer.path = layui.cache.dir;
  1616. ready.run(layui.$);
  1617.  
  1618. //暴露模块
  1619. window.layer = layer;
  1620. exports('layer', layer);
  1621. }))
  1622. : typeof define === 'function' && define.amd
  1623. ? define(['jquery'], function () {
  1624. //requirejs 加载
  1625. ready.run(window.jQuery);
  1626. return layer;
  1627. })
  1628. : (function () {
  1629. //普通 script 标签加载
  1630. console.log('layer.ready();===========');
  1631. layer.ready();
  1632. ready.run(window.jQuery);
  1633. })();
  1634. })(window);
  1635.  
  1636. function AddLayerStyle(){
  1637. GM_(`
  1638. html #layuicss-layer{display: none; position: absolute; width: 1989px;}
  1639.  
  1640. /* common */
  1641. .layui-layer-shade, .layui-layer{position:fixed; _position:absolute; pointer-events: auto;}
  1642. .layui-layer-shade{top:0; left:0; width:100%; height:100%; _height:expression(document.body.offsetHeight+"px");}
  1643. .layui-layer{-webkit-overflow-scrolling: touch;}
  1644. .layui-layer{top:150px; left: 0; margin:0; padding:0; background-color:#fff; -webkit-background-clip: content; border-radius: 2px; box-shadow: 1px 1px 50px rgba(0,0,0,.3);}
  1645. .layui-layer-close{position:absolute;}
  1646. .layui-layer-content{position:relative;}
  1647. .layui-layer-border{border: 1px solid #B2B2B2; border: 1px solid rgba(0,0,0,.1); box-shadow: 1px 1px 5px rgba(0,0,0,.2);}
  1648. .layui-layer-load{background:url(https://cdn.bootcdn.net/ajax/libs/layer/3.5.1/theme/default/loading-1.gif) #eee center center no-repeat;}
  1649. .layui-layer-ico{ background:url(https://cdn.bootcdn.net/ajax/libs/layer/3.5.1/theme/default/icon.png) no-repeat;}
  1650. .layui-layer-dialog .layui-layer-ico,
  1651. .layui-layer-setwin a,
  1652. .layui-layer-btn a{display:inline-block; *display:inline; *zoom:1; vertical-align:top;}
  1653. .layui-layer-move{display: none; position: fixed; *position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; cursor: move; opacity: 0; filter:alpha(opacity=0); background-color: #fff; z-index: 2147483647;}
  1654. .layui-layer-resize{position: absolute; width: 15px; height: 15px; right: 0; bottom: 0; cursor: se-resize;}
  1655.  
  1656. /* 动画 */
  1657. .layer-anim{-webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration:.3s; animation-duration:.3s;}
  1658.  
  1659. @-webkit-keyframes layer-bounceIn { /* 默认 */
  1660. 0% {opacity: 0; -webkit-transform: scale(.5); transform: scale(.5)}
  1661. 100% {opacity: 1; -webkit-transform: scale(1); transform: scale(1)}
  1662. }
  1663. @keyframes layer-bounceIn {
  1664. 0% {opacity: 0; -webkit-transform: scale(.5); -ms-transform: scale(.5); transform: scale(.5)}
  1665. 100% {opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1)}
  1666. }
  1667. .layer-anim-00{-webkit-animation-name: layer-bounceIn;animation-name: layer-bounceIn}
  1668.  
  1669. @-webkit-keyframes layer-zoomInDown{0%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes layer-zoomInDown{0%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);-ms-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(60px);-ms-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.layer-anim-01{-webkit-animation-name:layer-zoomInDown;animation-name:layer-zoomInDown}
  1670. @-webkit-keyframes layer-fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes layer-fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.layer-anim-02{-webkit-animation-name:layer-fadeInUpBig;animation-name:layer-fadeInUpBig}
  1671. @-webkit-keyframes layer-zoomInLeft{0%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(48px);transform:scale(.475) translateX(48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes layer-zoomInLeft{0%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);-ms-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(48px);-ms-transform:scale(.475) translateX(48px);transform:scale(.475) translateX(48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.layer-anim-03{-webkit-animation-name:layer-zoomInLeft;animation-name:layer-zoomInLeft}
  1672. @-webkit-keyframes layer-rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}}@keyframes layer-rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);-ms-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);-ms-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}}.layer-anim-04{-webkit-animation-name:layer-rollIn;animation-name:layer-rollIn}
  1673. @keyframes layer-fadeIn{0%{opacity:0}100%{opacity:1}}.layer-anim-05{-webkit-animation-name:layer-fadeIn;animation-name:layer-fadeIn}
  1674. @-webkit-keyframes layer-shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);transform:translateX(10px)}}@keyframes layer-shake{0%,100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);-ms-transform:translateX(10px);transform:translateX(10px)}}.layer-anim-06{-webkit-animation-name:layer-shake;animation-name:layer-shake}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}
  1675.  
  1676. /* 标题栏 */
  1677. .layui-layer-title{padding:0 80px 0 20px; height: 50px; line-height: 50px; border-bottom:1px solid #F0F0F0; font-size: 14px; color:#333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-radius: 2px 2px 0 0;}
  1678. .layui-layer-setwin{position:absolute; right: 15px; *right:0; top: 17px; font-size:0; line-height: initial;}
  1679. .layui-layer-setwin a{position:relative; width: 16px; height:16px; margin-left:10px; font-size:12px; _overflow:hidden;}
  1680. .layui-layer-setwin .layui-layer-min cite{position:absolute; width:14px; height:2px; left:0; top:50%; margin-top:-1px; background-color:#2E2D3C; cursor:pointer; _overflow:hidden;}
  1681. .layui-layer-setwin .layui-layer-min:hover cite{background-color:#2D93CA; }
  1682. .layui-layer-setwin .layui-layer-max{background-position:-32px -40px;}
  1683. .layui-layer-setwin .layui-layer-max:hover{background-position:-16px -40px;}
  1684. .layui-layer-setwin .layui-layer-maxmin{background-position:-65px -40px;}
  1685. .layui-layer-setwin .layui-layer-maxmin:hover{background-position:-49px -40px;}
  1686. .layui-layer-setwin .layui-layer-close1{background-position: 1px -40px; cursor: pointer;}
  1687. .layui-layer-setwin .layui-layer-close1:hover{opacity:0.7;}
  1688. .layui-layer-setwin .layui-layer-close2{position:absolute; right:-28px; top:-28px; width:30px; height:30px; margin-left:0; background-position:-149px -31px; *right:-18px; _display:none;}
  1689. .layui-layer-setwin .layui-layer-close2:hover{ background-position:-180px -31px;}
  1690.  
  1691. /* 按钮栏 */
  1692. .layui-layer-btn{text-align: right; padding: 0 15px 12px; pointer-events: auto; user-select: none; -webkit-user-select: none;}
  1693. .layui-layer-btn a{height: 28px; line-height: 28px; margin: 5px 5px 0; padding: 0 15px; border: 1px solid #dedede; background-color:#fff; color: #333; border-radius: 2px; font-weight:400; cursor:pointer; text-decoration: none;}
  1694. .layui-layer-btn a:hover{opacity: 0.9; text-decoration: none;}
  1695. .layui-layer-btn a:active{opacity: 0.8;}
  1696. .layui-layer-btn .layui-layer-btn0{border-color: #1E9FFF; background-color: #1E9FFF; color:#fff;}
  1697. .layui-layer-btn-l{text-align: left;}
  1698. .layui-layer-btn-c{text-align: center;}
  1699.  
  1700. /* 定制化 */
  1701. .layui-layer-dialog{min-width: 300px;}
  1702. .layui-layer-dialog .layui-layer-content{position: relative; padding:20px; line-height:24px; word-break: break-all; overflow:hidden; font-size:14px; overflow-x: hidden; overflow-y:auto;}
  1703. .layui-layer-dialog .layui-layer-content .layui-layer-ico{position:absolute; top:16px; left:15px; _left:-40px; width:30px; height:30px;}
  1704. .layui-layer-ico1{background-position:-30px 0 }
  1705. .layui-layer-ico2{background-position:-60px 0;}
  1706. .layui-layer-ico3{background-position:-90px 0;}
  1707. .layui-layer-ico4{background-position:-120px 0;}
  1708. .layui-layer-ico5{background-position:-150px 0;}
  1709. .layui-layer-ico6{background-position:-180px 0;}
  1710. .layui-layer-rim{border:6px solid #8D8D8D; border:6px solid rgba(0,0,0,.3); border-radius:5px; box-shadow: none;}
  1711. .layui-layer-msg{min-width:180px; border:1px solid #D3D4D3; box-shadow: none;}
  1712. .layui-layer-hui{min-width:100px; background-color: #000; filter:alpha(opacity=60); background-color: rgba(0,0,0,0.6); color: #fff; border:none;}
  1713. .layui-layer-hui .layui-layer-content{padding:12px 25px; text-align:center;}
  1714. .layui-layer-dialog .layui-layer-padding{padding: 20px 20px 20px 55px; text-align: left;}
  1715. .layui-layer-page .layui-layer-content{position:relative; overflow:auto;}
  1716. .layui-layer-page .layui-layer-btn,.layui-layer-iframe .layui-layer-btn{padding-top:10px;}
  1717. .layui-layer-nobg{background:none;}
  1718. .layui-layer-iframe iframe{display: block; width: 100%;}
  1719.  
  1720. .layui-layer-loading{border-radius:100%; background:none; box-shadow:none; border:none;}
  1721. .layui-layer-loading .layui-layer-content{width:60px; height:24px; background:url(https://cdn.bootcdn.net/ajax/libs/layer/3.5.1/theme/default/loading-0.gif) no-repeat;}
  1722. .layui-layer-loading .layui-layer-loading1{width:37px; height:37px; background:url(https://cdn.bootcdn.net/ajax/libs/layer/3.5.1/theme/default/loading-1.gif) no-repeat;}
  1723. .layui-layer-loading .layui-layer-loading2, .layui-layer-ico16{width:32px; height:32px; background:url(https://cdn.bootcdn.net/ajax/libs/layer/3.5.1/theme/default/loading-2.gif) no-repeat;}
  1724. .layui-layer-tips{background: none; box-shadow:none; border:none;}
  1725. .layui-layer-tips .layui-layer-content{position: relative; line-height: 22px; min-width: 12px; padding: 8px 15px; font-size: 12px; _float:left; border-radius: 2px; box-shadow: 1px 1px 3px rgba(0,0,0,.2); background-color: #000; color: #fff;}
  1726. .layui-layer-tips .layui-layer-close{right:-2px; top:-1px;}
  1727. .layui-layer-tips i.layui-layer-TipsG{ position:absolute; width:0; height:0; border-width:8px; border-color:transparent; border-style:dashed; *overflow:hidden;}
  1728. .layui-layer-tips i.layui-layer-TipsT, .layui-layer-tips i.layui-layer-TipsB{left:5px; border-right-style:solid; border-right-color: #000;}
  1729. .layui-layer-tips i.layui-layer-TipsT{bottom:-8px;}
  1730. .layui-layer-tips i.layui-layer-TipsB{top:-8px;}
  1731. .layui-layer-tips i.layui-layer-TipsR, .layui-layer-tips i.layui-layer-TipsL{top: 5px; border-bottom-style:solid; border-bottom-color: #000;}
  1732. .layui-layer-tips i.layui-layer-TipsR{left:-8px;}
  1733. .layui-layer-tips i.layui-layer-TipsL{right:-8px;}
  1734.  
  1735. /* skin */
  1736. .layui-layer-lan[type="dialog"]{min-width:280px;}
  1737. .layui-layer-lan .layui-layer-title{background:#4476A7; color:#fff; border: none;}
  1738. .layui-layer-lan .layui-layer-btn{padding: 5px 10px 10px; text-align: right; border-top:1px solid #E9E7E7}
  1739. .layui-layer-lan .layui-layer-btn a{background: #fff; border-color: #E9E7E7; color: #333;}
  1740. .layui-layer-lan .layui-layer-btn .layui-layer-btn1{background:#C9C5C5;}
  1741. .layui-layer-molv .layui-layer-title{background: #009f95; color:#fff; border: none;}
  1742. .layui-layer-molv .layui-layer-btn a{background: #009f95; border-color: #009f95;}
  1743. .layui-layer-molv .layui-layer-btn .layui-layer-btn1{background:#92B8B1;}
  1744.  
  1745. .layui-layer-iconext{background:url(https://cdn.bootcdn.net/ajax/libs/layer/3.5.1/theme/default/icon-ext.png) no-repeat;}
  1746.  
  1747. /* prompt模式 */
  1748. .layui-layer-prompt .layui-layer-input{display: block; width: 260px; height: 36px; margin: 0 auto; line-height: 30px; padding-left: 10px; border: 1px solid #e6e6e6; color: #333;}
  1749. .layui-layer-prompt textarea.layui-layer-input{width: 300px; height: 100px; line-height: 20px; padding: 6px 10px;}
  1750. .layui-layer-prompt .layui-layer-content{padding: 20px;}
  1751. .layui-layer-prompt .layui-layer-btn{padding-top: 0;}
  1752.  
  1753. /* tab模式 */
  1754. .layui-layer-tab{box-shadow:1px 1px 50px rgba(0,0,0,.4);}
  1755. .layui-layer-tab .layui-layer-title{padding-left:0; overflow: visible;}
  1756. .layui-layer-tab .layui-layer-title span{position:relative; float:left; min-width:80px; max-width: 300px; padding:0 20px; text-align:center; cursor:default; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; cursor: pointer;}
  1757. .layui-layer-tab .layui-layer-title span.layui-this{height: 51px; border-left: 1px solid #eee; border-right: 1px solid #eee; background-color: #fff; z-index: 10;}
  1758. .layui-layer-tab .layui-layer-title span:first-child{border-left:none;}
  1759. .layui-layer-tabmain{line-height:24px; clear:both;}
  1760. .layui-layer-tabmain .layui-layer-tabli{display:none;}
  1761. .layui-layer-tabmain .layui-layer-tabli.layui-this{display: block;}
  1762.  
  1763. /* photo模式 */
  1764. .layui-layer-photos{background: none; box-shadow: none;}
  1765. .layui-layer-photos .layui-layer-content{overflow:hidden; text-align: center;}
  1766. .layui-layer-photos .layui-layer-phimg img{position: relative; width:100%; display: inline-block; *display:inline; *zoom:1; vertical-align:top;}
  1767. .layui-layer-imgprev, .layui-layer-imgnext{position: fixed; top: 50%; width: 27px; _width: 44px; height: 44px; margin-top:-22px; outline:none;blr:expression(this.onFocus=this.blur());}
  1768. .layui-layer-imgprev{left: 30px; background-position:-5px -5px; _background-position:-70px -5px;}
  1769. .layui-layer-imgprev:hover{background-position:-33px -5px; _background-position:-120px -5px;}
  1770. .layui-layer-imgnext{right: 30px; _right:8px; background-position:-5px -50px; _background-position:-70px -50px;}
  1771. .layui-layer-imgnext:hover{background-position: -33px -50px; _background-position: -120px -50px;}
  1772. .layui-layer-imgbar{position: fixed; left:0; right: 0; bottom:0; width:100%; height: 40px; line-height: 40px; background-color:#000; filter:Alpha(opacity=60); background-color: rgba(2,0,0,.35); color: #fff; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-size:0;}
  1773. .layui-layer-imgtit{}
  1774. .layui-layer-imgtit *{display:inline-block; *display:inline; *zoom:1; vertical-align:top; font-size:12px;}
  1775. .layui-layer-imgtit a{max-width:65%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; color:#fff;}
  1776. .layui-layer-imgtit a:hover{color:#fff; text-decoration:underline;}
  1777. .layui-layer-imgtit em{padding-left:10px; font-style: normal;}
  1778.  
  1779. /* 关闭动画 */
  1780. @-webkit-keyframes layer-bounceOut {
  1781. 100% {opacity: 0; -webkit-transform: scale(.7); transform: scale(.7)}
  1782. 30% {-webkit-transform: scale(1.05); transform: scale(1.05)}
  1783. 0% {-webkit-transform: scale(1); transform: scale(1);}
  1784. }
  1785. @keyframes layer-bounceOut {
  1786. 100% {opacity: 0; -webkit-transform: scale(.7); -ms-transform: scale(.7); transform: scale(.7);}
  1787. 30% {-webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05);}
  1788. 0% {-webkit-transform: scale(1); -ms-transform: scale(1);transform: scale(1);}
  1789. }
  1790. .layer-anim-close{-webkit-animation-name: layer-bounceOut; animation-name: layer-bounceOut; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration:.2s; animation-duration:.2s;}
  1791.  
  1792. @media screen and (max-width: 1100px) {
  1793. .layui-layer-iframe{overflow-y: auto; -webkit-overflow-scrolling: touch;}
  1794. }
  1795. `);
  1796. }