This commit is contained in:
@@ -0,0 +1,24 @@
|
||||
@import "../tool/color.css";
|
||||
@import "../tool/size.css";
|
||||
@import "../tool/utils.css";
|
||||
|
||||
.type_list {
|
||||
li {
|
||||
text-align: center;
|
||||
margin-bottom: var(--f10);
|
||||
width: 25%;
|
||||
a {
|
||||
.text {
|
||||
color: var(--textColor);
|
||||
font-size: var(--f18);
|
||||
margin-bottom: .14rem;
|
||||
}
|
||||
.nums {
|
||||
font-size: var(--f14);
|
||||
color: var(--tipsTextColor);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
@@ -4,11 +4,7 @@
|
||||
|
||||
|
||||
.header {
|
||||
color: var(--textColor);
|
||||
font-size: var(--f16);
|
||||
.title{
|
||||
margin: 0 .16rem;
|
||||
}
|
||||
|
||||
.ilist {
|
||||
i {
|
||||
font-size: var(--f22) !important;
|
||||
|
||||
0
css/page/tagListInfo.css
Normal file
0
css/page/tagListInfo.css
Normal file
@@ -3,469 +3,519 @@
|
||||
* Copyright (c) 2020. bmy
|
||||
*/
|
||||
|
||||
.iconfont {
|
||||
.iconfont {
|
||||
font-size: .32rem;
|
||||
}
|
||||
}
|
||||
|
||||
p,body,h1,h2,h3,h4,h5,h6,ul,li{
|
||||
p,
|
||||
body,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
ul,
|
||||
li {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: sans-serif; /* 1 */
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
body {
|
||||
width: 100%;
|
||||
font-size: 0px;
|
||||
background-color: #fff;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 0;
|
||||
height: 0;
|
||||
html {
|
||||
font-family: sans-serif;
|
||||
/* 1 */
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
body {
|
||||
width: 100%;
|
||||
font-size: 0px;
|
||||
background-color: #fff;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
}
|
||||
|
||||
article,
|
||||
aside,
|
||||
footer,
|
||||
header,
|
||||
nav,
|
||||
section {
|
||||
display: block;
|
||||
}
|
||||
::-webkit-scrollbar {
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
a {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
article,
|
||||
aside,
|
||||
footer,
|
||||
header,
|
||||
nav,
|
||||
section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the font size and margin on `h1` elements within `section` and
|
||||
* `article` contexts in Chrome, Firefox, and Safari.
|
||||
*/
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
|
||||
/* Grouping content
|
||||
/* Grouping content
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
* 1. Add the correct display in IE.
|
||||
*/
|
||||
|
||||
figcaption,
|
||||
figure,
|
||||
main { /* 1 */
|
||||
display: block;
|
||||
}
|
||||
figcaption,
|
||||
figure,
|
||||
main {
|
||||
/* 1 */
|
||||
display: block;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Add the correct margin in IE 8.
|
||||
*/
|
||||
|
||||
figure {
|
||||
margin: 1em 40px;
|
||||
}
|
||||
figure {
|
||||
margin: 1em 40px;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 1. Add the correct box sizing in Firefox.
|
||||
* 2. Show the overflow in Edge and IE.
|
||||
*/
|
||||
|
||||
hr {
|
||||
box-sizing: content-box; /* 1 */
|
||||
height: 0; /* 1 */
|
||||
overflow: visible; /* 2 */
|
||||
}
|
||||
hr {
|
||||
box-sizing: content-box;
|
||||
/* 1 */
|
||||
height: 0;
|
||||
/* 1 */
|
||||
overflow: visible;
|
||||
/* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
|
||||
pre {
|
||||
font-family: monospace, monospace; /* 1 */
|
||||
font-size: 1em; /* 2 */
|
||||
white-space: pre-wrap;
|
||||
word-break: break-all;
|
||||
margin: 0;
|
||||
}
|
||||
pre {
|
||||
font-family: monospace, monospace;
|
||||
/* 1 */
|
||||
font-size: 1em;
|
||||
/* 2 */
|
||||
white-space: pre-wrap;
|
||||
word-break: break-all;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Text-level semantics
|
||||
/* Text-level semantics
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
/**
|
||||
* 1. Remove the gray background on active links in IE 10.
|
||||
* 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
|
||||
*/
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
background-color: transparent; /* 1 */
|
||||
-webkit-text-decoration-skip: objects; /* 2 */
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
}
|
||||
a {
|
||||
text-decoration: none;
|
||||
background-color: transparent;
|
||||
/* 1 */
|
||||
-webkit-text-decoration-skip: objects;
|
||||
/* 2 */
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Remove the outline on focused links when they are also active or hovered
|
||||
* in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
a:active,
|
||||
a:hover {
|
||||
outline-width: 0;
|
||||
}
|
||||
a:active,
|
||||
a:hover {
|
||||
outline-width: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 1. Remove the bottom border in Firefox 39-.
|
||||
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
||||
*/
|
||||
|
||||
abbr[title] {
|
||||
border-bottom: none; /* 1 */
|
||||
text-decoration: underline; /* 2 */
|
||||
text-decoration: underline dotted; /* 2 */
|
||||
}
|
||||
abbr[title] {
|
||||
border-bottom: none;
|
||||
/* 1 */
|
||||
text-decoration: underline;
|
||||
/* 2 */
|
||||
text-decoration: underline dotted;
|
||||
/* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Prevent the duplicate application of `bolder` by the next rule in Safari 6.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: inherit;
|
||||
}
|
||||
b,
|
||||
strong {
|
||||
font-weight: inherit;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder;
|
||||
}
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
|
||||
code,
|
||||
kbd,
|
||||
samp {
|
||||
font-family: monospace, monospace; /* 1 */
|
||||
font-size: 1em; /* 2 */
|
||||
}
|
||||
code,
|
||||
kbd,
|
||||
samp {
|
||||
font-family: monospace, monospace;
|
||||
/* 1 */
|
||||
font-size: 1em;
|
||||
/* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Add the correct font style in Android 4.3-.
|
||||
*/
|
||||
|
||||
dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Add the correct background and color in IE 9-.
|
||||
*/
|
||||
|
||||
mark {
|
||||
background-color: #ff0;
|
||||
color: #000;
|
||||
}
|
||||
mark {
|
||||
background-color: #ff0;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Add the correct font size in all browsers.
|
||||
*/
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Prevent `sub` and `sup` elements from affecting the line height in
|
||||
* all browsers.
|
||||
*/
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
/* Embedded content
|
||||
/* Embedded content
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
*/
|
||||
|
||||
audio,
|
||||
video {
|
||||
display: inline-block;
|
||||
}
|
||||
audio,
|
||||
video {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Add the correct display in iOS 4-7.
|
||||
*/
|
||||
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
}
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Remove the border on images inside links in IE 10-.
|
||||
*/
|
||||
|
||||
img {
|
||||
border-style: none;
|
||||
}
|
||||
img {
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Hide the overflow in IE.
|
||||
*/
|
||||
|
||||
svg:not(:root) {
|
||||
overflow: hidden;
|
||||
}
|
||||
svg:not(:root) {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Forms
|
||||
/* Forms
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
/**
|
||||
* 1. Change the font styles in all browsers (opinionated).
|
||||
* 2. Remove the margin in Firefox and Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
border: none;
|
||||
outline: none;
|
||||
font-family: sans-serif; /* 1 */
|
||||
font-size: 100%; /* 1 */
|
||||
line-height: 1.15; /* 1 */
|
||||
margin: 0; /* 2 */
|
||||
}
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
border: none;
|
||||
outline: none;
|
||||
font-family: sans-serif;
|
||||
/* 1 */
|
||||
font-size: 100%;
|
||||
/* 1 */
|
||||
line-height: 1.15;
|
||||
/* 1 */
|
||||
margin: 0;
|
||||
/* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Show the overflow in IE.
|
||||
* 1. Show the overflow in Edge.
|
||||
*/
|
||||
|
||||
button,
|
||||
input { /* 1 */
|
||||
overflow: visible;
|
||||
}
|
||||
button,
|
||||
input {
|
||||
/* 1 */
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||
* 1. Remove the inheritance of text transform in Firefox.
|
||||
*/
|
||||
|
||||
button,
|
||||
select { /* 1 */
|
||||
text-transform: none;
|
||||
}
|
||||
button,
|
||||
select {
|
||||
/* 1 */
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
|
||||
* controls in Android 4.
|
||||
* 2. Correct the inability to style clickable types in iOS and Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
html [type="button"], /* 1 */
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button; /* 2 */
|
||||
}
|
||||
button,
|
||||
html [type="button"],
|
||||
/* 1 */
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button;
|
||||
/* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Remove the inner border and padding in Firefox.
|
||||
*/
|
||||
|
||||
button::-moz-focus-inner,
|
||||
[type="button"]::-moz-focus-inner,
|
||||
[type="reset"]::-moz-focus-inner,
|
||||
[type="submit"]::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
button::-moz-focus-inner,
|
||||
[type="button"]::-moz-focus-inner,
|
||||
[type="reset"]::-moz-focus-inner,
|
||||
[type="submit"]::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Restore the focus styles unset by the previous rule.
|
||||
*/
|
||||
|
||||
button:-moz-focusring,
|
||||
[type="button"]:-moz-focusring,
|
||||
[type="reset"]:-moz-focusring,
|
||||
[type="submit"]:-moz-focusring {
|
||||
outline: 1px dotted ButtonText;
|
||||
}
|
||||
button:-moz-focusring,
|
||||
[type="button"]:-moz-focusring,
|
||||
[type="reset"]:-moz-focusring,
|
||||
[type="submit"]:-moz-focusring {
|
||||
outline: 1px dotted ButtonText;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Change the border, margin, and padding in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
fieldset {
|
||||
border: 1px solid #c0c0c0;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
}
|
||||
fieldset {
|
||||
border: 1px solid #c0c0c0;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 1. Correct the text wrapping in Edge and IE.
|
||||
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||
* 3. Remove the padding so developers are not caught out when they zero out
|
||||
* `fieldset` elements in all browsers.
|
||||
*/
|
||||
|
||||
legend {
|
||||
box-sizing: border-box; /* 1 */
|
||||
color: inherit; /* 2 */
|
||||
display: table; /* 1 */
|
||||
max-width: 100%; /* 1 */
|
||||
padding: 0; /* 3 */
|
||||
white-space: normal; /* 1 */
|
||||
}
|
||||
legend {
|
||||
box-sizing: border-box;
|
||||
/* 1 */
|
||||
color: inherit;
|
||||
/* 2 */
|
||||
display: table;
|
||||
/* 1 */
|
||||
max-width: 100%;
|
||||
/* 1 */
|
||||
padding: 0;
|
||||
/* 3 */
|
||||
white-space: normal;
|
||||
/* 1 */
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 1. Add the correct display in IE 9-.
|
||||
* 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||
*/
|
||||
|
||||
progress {
|
||||
display: inline-block; /* 1 */
|
||||
vertical-align: baseline; /* 2 */
|
||||
}
|
||||
progress {
|
||||
display: inline-block;
|
||||
/* 1 */
|
||||
vertical-align: baseline;
|
||||
/* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Remove the default vertical scrollbar in IE.
|
||||
*/
|
||||
|
||||
textarea {
|
||||
overflow: auto;
|
||||
resize: vertical;
|
||||
}
|
||||
textarea {
|
||||
overflow: auto;
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 1. Add the correct box sizing in IE 10-.
|
||||
* 2. Remove the padding in IE 10-.
|
||||
*/
|
||||
|
||||
[type="checkbox"],
|
||||
[type="radio"] {
|
||||
box-sizing: border-box; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
[type="checkbox"],
|
||||
[type="radio"] {
|
||||
box-sizing: border-box;
|
||||
/* 1 */
|
||||
padding: 0;
|
||||
/* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Correct the cursor style of increment and decrement buttons in Chrome.
|
||||
*/
|
||||
|
||||
[type="number"]::-webkit-inner-spin-button,
|
||||
[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
[type="number"]::-webkit-inner-spin-button,
|
||||
[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 1. Correct the odd appearance in Chrome and Safari.
|
||||
* 2. Correct the outline style in Safari.
|
||||
*/
|
||||
|
||||
[type="search"] {
|
||||
-webkit-appearance: textfield; /* 1 */
|
||||
outline-offset: -2px; /* 2 */
|
||||
}
|
||||
[type="search"] {
|
||||
-webkit-appearance: textfield;
|
||||
/* 1 */
|
||||
outline-offset: -2px;
|
||||
/* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
|
||||
*/
|
||||
|
||||
[type="search"]::-webkit-search-cancel-button,
|
||||
[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
[type="search"]::-webkit-search-cancel-button,
|
||||
[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||
* 2. Change font properties to `inherit` in Safari.
|
||||
*/
|
||||
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button; /* 1 */
|
||||
font: inherit; /* 2 */
|
||||
}
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button;
|
||||
/* 1 */
|
||||
font: inherit;
|
||||
/* 2 */
|
||||
}
|
||||
|
||||
/* Interactive
|
||||
/* Interactive
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
/*
|
||||
* Add the correct display in IE 9-.
|
||||
* 1. Add the correct display in Edge, IE, and Firefox.
|
||||
*/
|
||||
|
||||
details, /* 1 */
|
||||
menu {
|
||||
display: block;
|
||||
}
|
||||
details,
|
||||
/* 1 */
|
||||
menu {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/*
|
||||
/*
|
||||
* Add the correct display in all browsers.
|
||||
*/
|
||||
|
||||
summary {
|
||||
display: list-item;
|
||||
}
|
||||
summary {
|
||||
display: list-item;
|
||||
}
|
||||
|
||||
/* Scripting
|
||||
/* Scripting
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
*/
|
||||
|
||||
canvas {
|
||||
display: inline-block;
|
||||
}
|
||||
canvas {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/**
|
||||
/**
|
||||
* Add the correct display in IE.
|
||||
*/
|
||||
|
||||
template {
|
||||
display: none;
|
||||
}
|
||||
template {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Hidden
|
||||
/* Hidden
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
/**
|
||||
* Add the correct display in IE 10-.
|
||||
*/
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
||||
@@ -61,3 +61,9 @@
|
||||
text-overflow:ellipsis;
|
||||
white-space:nowrap;
|
||||
}
|
||||
|
||||
.header_title {
|
||||
color: var(--textColor);
|
||||
font-size: var(--f16);
|
||||
margin: 0 .16rem;
|
||||
}
|
||||
@@ -36,6 +36,7 @@ let config = {
|
||||
infoList: '/info/list',
|
||||
tagList: '/tag/list',
|
||||
tagRecommend: '/tag/recommend',
|
||||
tagInfo: '/tag/info',
|
||||
searchHot: '/search/hot',
|
||||
searchKey: '/search/key',
|
||||
}
|
||||
|
||||
@@ -1,6 +1,30 @@
|
||||
class Domestic {
|
||||
constructor() {
|
||||
util.header(
|
||||
`<div class="header_title">分类</div>`,
|
||||
"",
|
||||
""
|
||||
)
|
||||
util.footer()
|
||||
this.getTagListData()
|
||||
}
|
||||
|
||||
|
||||
async getTagListData() {
|
||||
let res = await tagServe.tagList()
|
||||
|
||||
$(".type_list").innerHTML = res.maps(v => {
|
||||
|
||||
return `
|
||||
<li>
|
||||
<a href="./tagListInfo.html?url=${v.url}&title=${v.title}">
|
||||
<div class="text">${v.title}</div>
|
||||
<p class="nums">${v.count}套</p>
|
||||
</a>
|
||||
</li>
|
||||
`
|
||||
})
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -17,7 +17,7 @@ class Index {
|
||||
this.getTagRecommend()
|
||||
this.getHomeHotData()
|
||||
this.getHomeListData()
|
||||
this.initSwiper()
|
||||
|
||||
this.event()
|
||||
}
|
||||
|
||||
@@ -39,8 +39,8 @@ class Index {
|
||||
$(".recommend-tag").innerHTML = res.maps(v => {
|
||||
return `
|
||||
<li>
|
||||
<div class="icon">${v.title.substr(0,1)}</div>
|
||||
<div class="title">${v.title}</div>
|
||||
<a class="icon" href="./tagListInfo.html?url=${v.url}&title=${v.title}">${v.title.substr(0,1)}</a>
|
||||
<a class="title" href="./tagListInfo.html?url=${v.url}&title=${v.title}">${v.title}</a>
|
||||
</li>
|
||||
`
|
||||
})
|
||||
@@ -56,14 +56,14 @@ class Index {
|
||||
</div>
|
||||
`
|
||||
})
|
||||
|
||||
this.initSwiper()
|
||||
}
|
||||
|
||||
|
||||
initSwiper() {
|
||||
var mySwiper = new Swiper('.banner', {
|
||||
loop: true, // 循环模式选项
|
||||
|
||||
// 如果需要分页器
|
||||
loop: true,
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
},
|
||||
|
||||
@@ -13,7 +13,7 @@ class Info {
|
||||
.then(() => {
|
||||
|
||||
util.header(
|
||||
`<div class="title flex1 ellipsis">${this.title}</div>`,
|
||||
`<div class="header_title flex1 ellipsis">${this.title}</div>`,
|
||||
`
|
||||
<div class="ilist">
|
||||
<i class="iconfont icon-wujiaoxing"></i>
|
||||
@@ -53,11 +53,15 @@ class Info {
|
||||
|
||||
// TODO 找一个合适分享
|
||||
$(".icon-fenxiang").onclick = async () => {
|
||||
await navShare({
|
||||
title: this.title,
|
||||
text: `我这有个好看的，快来看看 ${this.title}`,
|
||||
url: location.href
|
||||
})
|
||||
await navigator.clipboard.writeText(`
|
||||
我这有个好看的，快来看看 ${this.title}
|
||||
${location.href}
|
||||
`)
|
||||
// await navShare({
|
||||
// title: this.title,
|
||||
// text: `我这有个好看的，快来看看 ${this.title}`,
|
||||
// url: location.href
|
||||
// })
|
||||
}
|
||||
|
||||
let sc = $(".icon-wujiaoxing")
|
||||
|
||||
@@ -43,6 +43,7 @@ class Search {
|
||||
let input = $(".header input")
|
||||
|
||||
$(".header .button").onclick = async () => {
|
||||
this.page = 1
|
||||
if (input.value.length != 0) {
|
||||
this.keyword = input.value
|
||||
this.totalArr = []
|
||||
@@ -51,7 +52,13 @@ class Search {
|
||||
util.hidden(".no-search")
|
||||
item(".have-search ul", this.totalArr)
|
||||
util.show(".have-search")
|
||||
this.onscroll()
|
||||
onscroll(async () => {
|
||||
this.page += 1
|
||||
if (this.page <= this.totalPage) {
|
||||
await this.getSearchKeyData()
|
||||
item(".have-search ul", this.totalArr)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
@@ -75,23 +82,6 @@ class Search {
|
||||
this.totalPage = totalPage
|
||||
list.forEach(v => this.totalArr.push(v));
|
||||
}
|
||||
|
||||
// 滚动到底部实现自动加载下一页数据
|
||||
onscroll() {
|
||||
window.onscroll = async () => {
|
||||
var scrollHeight = Math.max(document.documentElement.scrollHeight, document.body.scrollHeight);
|
||||
var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
|
||||
var clientHeight = window.innerHeight || Math.min(document.documentElement.clientHeight, document.body.clientHeight);
|
||||
|
||||
if (clientHeight + Math.ceil(scrollTop) >= scrollHeight) {
|
||||
this.page += 1
|
||||
if (this.page <= this.totalPage) {
|
||||
await this.getSearchKeyData()
|
||||
item(".have-search ul", this.totalArr)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
new Search
|
||||
37
js/page/tagListInfo.js
Normal file
37
js/page/tagListInfo.js
Normal file
@@ -0,0 +1,37 @@
|
||||
class TagListInfo {
|
||||
page = 1;
|
||||
totalPage = 0;
|
||||
totalArr = []
|
||||
|
||||
constructor() {
|
||||
util.header(
|
||||
`<div class="header_title">${query("title")}</div>`,
|
||||
"",
|
||||
)
|
||||
this.getTagInfoData()
|
||||
}
|
||||
|
||||
async getTagInfoData() {
|
||||
let { totalPage, list } = await tagServe.tagInfo({
|
||||
url: query("url"),
|
||||
page: this.page
|
||||
});
|
||||
|
||||
this.totalPage = totalPage
|
||||
// list.forEach(v => {
|
||||
// this.totalArr.push(v)
|
||||
// });
|
||||
|
||||
this.totalArr = [ ...this.totalArr, ...list ]
|
||||
item(".default-model ul", this.totalArr)
|
||||
onscroll(async () => {
|
||||
this.page += 1
|
||||
if (this.page <= this.totalPage) {
|
||||
await this.getTagInfoData()
|
||||
// item(".default-model ul", list)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
new TagListInfo
|
||||
@@ -10,6 +10,15 @@ class TagServe {
|
||||
})
|
||||
}
|
||||
|
||||
async tagInfo (data = {}) {
|
||||
let http = new Ajax()
|
||||
// suc的返回值（ajax请求到的，后端给我们的数据）
|
||||
return await http.get({
|
||||
url: config.urlList.tagInfo,
|
||||
// data: data key 和 value 名字一样的时候，可以直接只写一个
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
async tagRecommend (data = {}) {
|
||||
let http = new Ajax()
|
||||
|
||||
@@ -101,9 +101,6 @@ class Utils {
|
||||
if (r != null) return decodeURIComponent(r[2]); return null;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
header(content, action, back = `<i class="iconfont icon-fanhui"></i>`) {
|
||||
this.$("body").insertAdjacentHTML('afterbegin', `
|
||||
<div class="header fixed flex ais flex1 border-box p15">
|
||||
@@ -118,6 +115,19 @@ class Utils {
|
||||
}
|
||||
}
|
||||
|
||||
// 滚动到底部实现自动加载下一页数据
|
||||
onscroll(callback) {
|
||||
window.onscroll = async () => {
|
||||
var scrollHeight = Math.max(document.documentElement.scrollHeight, document.body.scrollHeight);
|
||||
var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
|
||||
var clientHeight = window.innerHeight || Math.min(document.documentElement.clientHeight, document.body.clientHeight);
|
||||
|
||||
if (clientHeight + Math.ceil(scrollTop) >= scrollHeight) {
|
||||
callback()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
async navShare(title = "", text = "", url = "") {
|
||||
console.log(navigator.share && navigator.canShare);
|
||||
@@ -145,13 +155,18 @@ class Utils {
|
||||
}
|
||||
|
||||
getItem(key) {
|
||||
let local = localStorage.getItem(key)
|
||||
return local ? JSON.parse(local) : []
|
||||
let local = localStorage.getItem(key)
|
||||
return local ? JSON.parse(local) : []
|
||||
}
|
||||
}
|
||||
|
||||
let u = new Utils
|
||||
let util = u, { $, item, query, navShare, getItem, setItem } = u
|
||||
let util = u,
|
||||
{
|
||||
$, item, query, navShare,
|
||||
getItem, setItem, onscroll
|
||||
}
|
||||
= u
|
||||
|
||||
// let util = new Utils
|
||||
// let $ = (new Utils).$
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<title>国产</title>
|
||||
<script src="../js/utils/rem.js"></script>
|
||||
<link rel="stylesheet" href="../css/tool/clear.css">
|
||||
<link rel="stylesheet" href="http://at.alicdn.com/t/c/font_4738996_raea6u0p92.css">
|
||||
<link rel="stylesheet" href="http://at.alicdn.com/t/c/font_4738996_b8zp7vfi90h.css">
|
||||
<link rel="stylesheet" href="../css/tool/public.css">
|
||||
|
||||
<link rel="stylesheet" href="../css/page/domestic.css">
|
||||
@@ -16,12 +16,10 @@
|
||||
<body>
|
||||
|
||||
|
||||
<div class="header fixed border-box flex ais js">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
国产
|
||||
<ul class="type_list flex wrap p15">
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -30,8 +28,7 @@
|
||||
<script src="../js/utils/index.js"></script>
|
||||
<script src="../js/config/index.js"></script>
|
||||
<script src="../js/http/index.js"></script>
|
||||
<script src="../js/serve/home.js"></script>
|
||||
<script src="../js/serve/info.js"></script>
|
||||
<script src="../js/serve/tag.js"></script>
|
||||
<script src="../js/page/domestic.js"></script>
|
||||
|
||||
</html>
|
||||
30
page/tagListInfo.html
Normal file
30
page/tagListInfo.html
Normal file
@@ -0,0 +1,30 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<script src="../js/utils/rem.js"></script>
|
||||
<link rel="stylesheet" href="../css/tool/clear.css">
|
||||
<link rel="stylesheet" href="http://at.alicdn.com/t/c/font_4738996_b8zp7vfi90h.css">
|
||||
<link rel="stylesheet" href="../css/tool/public.css">
|
||||
<link rel="stylesheet" href="../css/page/tagListInfo.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div class="content">
|
||||
<div class="recommend-model default-model">
|
||||
<ul class="flex list p15 js"></ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
<script src="../js/utils/index.js"></script>
|
||||
<script src="../js/config/index.js"></script>
|
||||
<script src="../js/http/index.js"></script>
|
||||
<script src="../js/serve/tag.js"></script>
|
||||
<script src="../js/page/tagListInfo.js"></script>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user