Skip to content

U
unidocs-zh

取酒独倾 / unidocs-zh
与 Fork 源项目一致

Fork自 DCloud / unidocs-zh

通知 1
Star 0
Fork 0
U
unidocs-zh

体验新版 GitCode，发现更多精彩内容 >>

提交 30622da5 编写于 作者: D DCloud_LXH
浏览文件
操作

chore: case.md

上级 7c7b544e
展开全部 隐藏空白更改
内联 并排
Showing with 538 addition and 234 deletion
docs/.vuepress/components/md/banner.vue 0 → 100644
浏览文件 @ 30622da5
<template>
<div class="banner">
<div class="slider">
<span class="slider-btn slider-btn-left"></span>
<span class="slider-btn slider-btn-right"></span>
<div class="slider-group">
<template v-for="item in images">
<div class="slider-item" :key="item">
<img :src="item" />
</div>
</template>
<!-- <div class="slider-item">
<img src="https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/case/case5.png">
</div> -->
<!-- <div class="slider-item">
<img src="https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/case/case7.png">
</div> -->
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
images: [
'https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/41136990-4f3e-11eb-8ff1-d5dcf8779628.png',
'https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/3ecf6d00-4f3e-11eb-8ff1-d5dcf8779628.png',
'https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/3df62400-4f3e-11eb-8ff1-d5dcf8779628.png',
'https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/3f872440-4f3e-11eb-8a36-ebb87efcf8c0.png',
'https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/40596860-4f3e-11eb-bdc1-8bd33eb6adaa.png',
],
};
},
mounted() {
this.StartBanner();
},
methods: {
StartBanner() {
var banner = document.querySelector('.banner'),
slider = document.querySelector('.slider-group'),
sliderItems = document.querySelectorAll('.slider-item'),
sliderLength = sliderItems.length;
var bannerWidth = null,
index = 1; //slider下标
var arrowLeft = document.querySelector('.slider-btn-left'),
arrowRight = document.querySelector('.slider-btn-right');
//创建dots
var sliderDots = document.createElement('div');
sliderDots.className = 'slider-dots';
var dots = '<span class="dot active" data-num="0"></span>';
for (var i = 1; i < sliderLength; i++) {
dots += '<span class="dot" data-num="' + i + '"></span>';
}
sliderDots.innerHTML = dots;
document.querySelector('.slider').appendChild(sliderDots);
//在第一个前、最后一个后各加一个item
var last_item = document.createElement('div'),
next_item = document.createElement('div');
last_item.className = 'slider-item';
last_item.innerHTML = sliderItems[sliderItems.length - 1].innerHTML;
slider.insertBefore(last_item, sliderItems[0]);
next_item.className = 'slider-item';
next_item.innerHTML = sliderItems[0].innerHTML;
slider.appendChild(next_item);
sliderItems = document.querySelectorAll('.slider-item');
function setSlider() {
bannerWidth = banner.offsetWidth;
for (var i = 0, length = sliderItems.length; i < length; i++) {
sliderItems[i].style.width = bannerWidth + 'px';
}
slider.style.width = sliderItems.length * bannerWidth + 'px';
slider.style.transition = 'transform 0ms';
slider.style.transform = 'translate(' + -index * bannerWidth + 'px, 0px)';
}
setSlider();
window.onresize = setSlider;
var sliderTime = setInterval(sliderStart, 5000);
function sliderStart() {
//开始轮播)
/* if(!~location.pathname.indexOf($docsify.banner)){
clearInterval(sliderTime);
return;
} */
index += 1;
if (index < 0 || index > sliderLength + 1) {
index = index < 0 ? 0 : sliderLength + 1;
}
slider.style.transition = 'transform 300ms';
document.querySelector('.active.dot').classList.remove('active');
var dotIndex = index > sliderLength ? 0 : index < 1 ? sliderLength - 1 : index - 1;
sliderDots.children[dotIndex].classList.add('active');
slider.style.transform = 'translate(' + -index * bannerWidth + 'px, 0px)';
setTimeout(function () {
if (index > sliderLength || index < 1) {
index = index > sliderLength ? 1 : sliderLength;
slider.style.transition = 'transform 0ms';
slider.style.transform = 'translate(' + -index * bannerWidth + 'px, 0px)';
}
}, 300);
}
var mouseClearSlider = false;
sliderDots.addEventListener('mouseover', function (e) {
showArrow();
if (e.target.tagName === 'SPAN') {
mouseClearSlider = true;
clearInterval(sliderTime);
if (e.target.className === 'dot') {
slider.style.transition = 'transform 300ms';
document.querySelector('.active.dot').classList.remove('active');
e.target.classList.add('active');
index = Number(e.target.dataset.num) + 1;
slider.style.transform = 'translate(' + -index * bannerWidth + 'px, 0px)';
}
return;
}
if (mouseClearSlider) {
mouseClearSlider = false;
clearInterval(sliderTime);
sliderTime = setInterval(sliderStart, 5000);
}
});
sliderDots.addEventListener('mouseout', function (e) {
hideArrow();
if (mouseClearSlider) {
mouseClearSlider = false;
clearInterval(sliderTime);
sliderTime = setInterval(sliderStart, 5000);
}
});
// 处理 banner 的两个箭头
document.querySelector('.slider').addEventListener('mouseover', showArrow);
document.querySelector('.slider').addEventListener('mouseout', hideArrow);
arrowLeft.addEventListener('mouseover', showArrow);
arrowLeft.addEventListener('mouseout', hideArrow);
arrowRight.addEventListener('mouseover', showArrow);
arrowRight.addEventListener('mouseout', hideArrow);
function showArrow() {
//显示箭头
arrowLeft.style.display = 'block';
arrowRight.style.display = 'block';
// var scroll_left = document.documentElement.scrollLeft;
// arrowLeft.style.left = scroll_left + "px";
// arrowRight.style.right = document.documentElement.scrollWidth - document.documentElement.clientWidth - scroll_left +
// 'px';
}
function hideArrow() {
//隐藏箭头
arrowLeft.style.display = 'none';
arrowRight.style.display = 'none';
}
arrowLeft.addEventListener('click', function () {
index -= 2;
clearInterval(sliderTime);
sliderStart();
sliderTime = setInterval(sliderStart, 5000);
});
arrowRight.addEventListener('click', function () {
clearInterval(sliderTime);
sliderStart();
sliderTime = setInterval(sliderStart, 5000);
});
},
},
};
</script>
<style>
/* banner */
.banner {
width: 100%;
margin: 0 auto;
overflow: hidden;
}
.slider {
position: relative;
width: 100%;
overflow: hidden;
}
.slider-btn {
position: absolute;
cursor: pointer;
width: 41px;
height: 69px;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
z-index: 20;
display: none;
background-image: url(https://vkceyugu.cdn.bspapp.com/VKCEYUGU-f184e7c3-1912-41b2-b81f-435d1b37c7b4/d2c41062-9e93-478f-9c06-06778b0f2c84.png);
}
.slider-btn.slider-btn-left {
left: 0;
}
.slider-btn.slider-btn-right {
right: 0;
background-position-x: 41px;
}
.slider-item {
float: left;
width: 100%;
}
.slider .slider-dots {
display: none;
position: absolute;
line-height: 0;
left: 50%;
bottom: 5px;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
text-align: center;
font-size: 0;
}
.slider .dot {
display: inline-block;
margin: 0 5px;
width: 10px;
height: 10px;
border-radius: 50%;
background: #ccc;
cursor: pointer;
}
.slider .dot.active {
width: 30px;
border-radius: 10px;
background: rgb(225, 114, 0);
}
/* 修改左侧导航 */
.sidebar .sidebar-nav {
padding: 0 0 11px 0;
}
.sidebar ul {
padding-left: 15px;
}
.sidebar ul li a:hover {
text-decoration: none;
background-color: #eff1f3;
}
.sidebar ul li.active > a:hover {
background-color: #ffffff;
}
.sidebar::-webkit-scrollbar {
width: 6px;
}
/* 处理左侧导航的折叠问题TODO */
.sidebar-nav-li.close ul {
display: none;
}
.sidebar-nav-li .chapter {
display: block;
height: 30px;
line-height: 30px;
position: relative;
cursor: pointer;
}
.sidebar-nav-li .chapter:hover {
background-color: #eff1f3;
}
.sidebar-nav-li .chapter:before {
position: absolute;
top: 10px;
left: -16px;
content: '\e581';
font-family: 'uniicons';
font-style: normal;
font-weight: 600;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: greyscale;
color: #8d8d8d;
font-size: 10px;
}
.sidebar-nav-li.close .chapter:before {
content: '\e583';
}
</style>
docs/.vuepress/theme/config/siderbar/uniCloud.js
浏览文件 @ 30622da5
......@@ -33,6 +33,11 @@ export default {
},
{
"number": "599819864",
"state": 1,
attendance: 1000
},
{
"number": "641753405",
"state": 0
},
]
......
docs/.vuepress/theme/layouts/Layout.vue
浏览文件 @ 30622da5
......@@ -15,20 +15,18 @@
@click="toggleSidebar(false)"
/>
<ClientOnly>
<Sidebar
:items="sidebarItems"
@toggle-sidebar="toggleSidebar"
>
<template #top>
<slot name="sidebar-top" />
</template>
<template #bottom>
<slot name="sidebar-bottom" />
<SiderBarBottom />
</template>
</Sidebar>
</ClientOnly>
<Sidebar
:items="sidebarItems"
@toggle-sidebar="toggleSidebar"
>
<template #top>
<slot name="sidebar-top" />
</template>
<template #bottom>
<slot name="sidebar-bottom" />
<SiderBarBottom />
</template>
</Sidebar>
<Home v-if="$page.frontmatter.home" />
......@@ -183,7 +181,7 @@ export default {
},
watch: {
isSidebarOpen: forbidScroll,
$route(){
$route() {
this.renderNavLinkState()
}
}
......
docs/case.md
浏览文件 @ 30622da5
此差异已折叠。
docs/uniCloud/_sidebar.md
浏览文件 @ 30622da5
......@@ -58,55 +58,3 @@
* [微信云开发转uniCloud](uniCloud/wx2unicloud.md)
* [uniCloud产品服务协议](uniCloud/agreement.md)
* [更新日志](uniCloud/release.md)
<li></li>
<div class="contact-box">
<a href="//unicloud.dcloud.net.cn" target="_blank" class="contact-item">
<img src="https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/7962e8e0-4f2d-11eb-a16f-5b3e54966275.jpg" width="20" height="20"/>
<div class="contact-smg">
<div>uniCloud Web控制台</div>
</div>
</a>
<a href="//ask.dcloud.net.cn/explore/" target="_blank" class="contact-item">
<img src="https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/73fc4f90-4f2d-11eb-a16f-5b3e54966275.png" width="20" height="20"/>
<div class="contact-smg">
<div>论坛</div>
</div>
</a>
<a href="https://uniad.dcloud.net.cn" target="_blank" class="contact-item">
<img src="https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/765d9820-4f2d-11eb-bd01-97bc1429a9ff.png" width="20" height="20"/>
<div class="contact-smg">
<div>uniAD</div>
</div>
</a>
<a href="https://tongji.dcloud.net.cn/" target="_blank" class="contact-item">
<img src="https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/77159d80-4f2d-11eb-a16f-5b3e54966275.png" width="20" height="20"/>
<div class="contact-smg">
<div>uni统计</div>
</div>
</a>
<div class="contact-item">
<img src="https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/74cda950-4f2d-11eb-a16f-5b3e54966275.png" width="20" height="20"/>
<div class="contact-smg">
<div>
代码仓库：<a href="https://gitee.com/dcloud/uni-app" target="_blank">码云</a>、<a href="http://github.com/dcloudio/uni-app" target="_blank">GitHub</a>
</div>
</div>
</div>
<div class="contact-item">
<img src="https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/759713d0-4f2d-11eb-a16f-5b3e54966275.png" width="20" height="20"/>
<div class="contact-smg">
<div>uniCloud QQ交流群</div>
<div>群1：1012245137 (2000人已满)</div>
<div>群2：749911289 (1000人已满)</div>
<div>群3：599819864 (1000人已满)</div>
<div>群4：641753405 &nbsp;<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=n8Qk7gMN-ppFly_vE9_S34hLNXz25PVI&jump_from=webapi">点此加入</a></div>
</div>
</div>
<div class="contact-item">
<img src="https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/77df7d30-4f2d-11eb-bd01-97bc1429a9ff.png" width="20" height="20"/>
<div class="contact-smg">
<div>关注微信公众号</div>
<img src="https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/78a8e7b0-4f2d-11eb-8ff1-d5dcf8779628.jpg" width="90" height="90"/>
</div>
</div>
</div>
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或