domTool.js 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. export function comDomHeight(el){
  2. let parent = el.offsetParent;
  3. let parentWidth = parent.offsetWidth;
  4. return parentWidth;
  5. }
  6. /**
  7. * 指定dom进入全屏
  8. * @param element
  9. */
  10. export function launchIntoFullscreen(element) {
  11. if(element.requestFullscreen){
  12. element.requestFullscreen();
  13. }
  14. else if(element.mozRequestFullScreen) {
  15. element.mozRequestFullScreen();
  16. }
  17. else if(element.webkitRequestFullscreen) {
  18. element.webkitRequestFullscreen();
  19. }
  20. else if(element.msRequestFullscreen) {
  21. element.msRequestFullscreen();
  22. }
  23. }
  24. /**
  25. * 退出全屏
  26. */
  27. export function exitFullscreen() {
  28. if(document.exitFullscreen) {
  29. document.exitFullscreen();
  30. } else if(document.mozCancelFullScreen) {
  31. document.mozCancelFullScreen();
  32. } else if(document.webkitExitFullscreen) {
  33. document.webkitExitFullscreen();
  34. }
  35. }
  36. /**
  37. * 检测是否处于全屏状态
  38. * @returns {*|boolean}
  39. */
  40. export function isFullscreenEnabled(){
  41. // console.log(document.fullscreenEnabled);
  42. if(document.fullscreenEnabled){
  43. return document.fullscreenElement
  44. }else if(document.mozFullScreenEnabled){
  45. return document.mozFullscreenElement
  46. }else if(document.webkitFullscreenEnabled){
  47. return document.webkitFullscreenElement
  48. }else if(document.msFullscreenEnabled){
  49. return document.msFullscreenElement
  50. }else{
  51. return document.mozFullScreenEnabled ||
  52. document.webkitFullscreenEnabled ||
  53. document.msFullscreenEnabled || false;
  54. }
  55. }
  56. function comDomStyle(el,lineNum,gap){
  57. if(!el){
  58. return -1;
  59. }
  60. let el_width = el.clientWidth;
  61. console.log(el_width);
  62. // 获取余数部分
  63. let remainder = el_width % lineNum;
  64. // 将子元素居中至于父元素中
  65. let itemAllWidth = (el_width - remainder) / lineNum;
  66. // 计算元素实际宽度
  67. let itemWidth = itemAllWidth - (gap * 2);
  68. let boxPadding = remainder / 2;
  69. let boxStyle = `padding:0 ${boxPadding}px;`;
  70. let itemStyle = `width:${itemWidth}px;height:${itemWidth}px;margin:${gap}px;`
  71. return {
  72. boxStyle,
  73. itemStyle,
  74. }
  75. }
  76. /**
  77. * 获取url参数
  78. * @param name
  79. * @returns {string}
  80. */
  81. export function getQueryString(name) {
  82. let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
  83. // console.log(window.location.search);
  84. let r = window.location.search.substr(1).match(reg);
  85. if (r != null) return decodeURI(r[2]);
  86. return '';
  87. }
  88. export default {
  89. comDomHeight,
  90. launchIntoFullscreen,
  91. exitFullscreen,
  92. isFullscreenEnabled,
  93. comDomStyle,
  94. getQueryString
  95. }