Skip to content

蒋秀川 / miniProject

Go to a project
Commit c8fe9121 by Tianqing Liu
Options

feat: 优化云台功能

1 parent bae9c55a
Inline Side-by-side
Showing 1 changed file with 21 additions and 22 deletions
h5/src/components/extension/videoTime.vue
......@@ -45,7 +45,7 @@
<div class="ptz-control-base ptz-control-bottom" @mousedown="ptzControlOneClick('down')" @mouseup="ptzControlStop" @mouseleave="ptzControlStop" @touchstart="ptzControlOneClick('down')" @touchend="ptzControlStop"></div>
<div class="ptz-control-content"></div>
</div>
<div class="ptz-control-right-box" style="display: none">
<div class="ptz-control-right-box">
<div class="ptz-control-jia" @mousedown="ptzControlOneClick('zoomExpand')" @mouseup="ptzControlStop" @mouseleave="ptzControlStop" @touchstart="ptzControlOneClick('zoomExpand')" @touchend="ptzControlStop">+</div>
<div class="ptz-control-jian" @mousedown="ptzControlOneClick('zoomNarrow')" @mouseup="ptzControlStop" @mouseleave="ptzControlStop" @touchstart="ptzControlOneClick('zoomNarrow')" @touchend="ptzControlStop">-</div>
</div>
......@@ -463,39 +463,39 @@ export default {
overflow: hidden;
.ptz-control-base {
border: none;
width: 4vw;
height: 4vw;
border-radius: 2vw;
width: 2.4vw;
height: 2.4vw;
border-radius: 1.2vw;
background-color: rgba(205, 207, 214, 1);
}
.ptz-control-left{
position: absolute;
display: inline-block;
top: calc(50% - 2vw);
top: calc(50% - 1vw);
left: 8vw;
}
.ptz-control-top{
position: absolute;
display: inline-block;
left: calc(50% - 2vw);
left: calc(50% - 1.4vw);
top: 8vw;
}
.ptz-control-right{
position: absolute;
display: inline-block;
top: calc(50% - 2vw);
top: calc(50% - 1vw);
left: calc(100% - 10vw);
}
.ptz-control-bottom{
position: absolute;
display: inline-block;
left: calc(50% - 2vw);
left: calc(50% - 1.4vw);
top: calc(100% - 10vw);
}
.ptz-control-content{
width: 14vw;
height: 14vw;
background-color: rgba(205, 207, 214, 1);
background: linear-gradient( 180deg, #E3E4EA 0%, #CDCFD6 100%);
position: absolute;
border-radius: 14vw;
left: calc(50% - 7vw);
......@@ -515,25 +515,24 @@ export default {
background-image: linear-gradient(0deg, rgba(131,197,224,0.8) 0%, rgba(100, 143, 252, 0) 30%);
}
.ptz-control-right-box{
display: inline-flex;
align-items: center;
justify-content: center;
color: #03a7ef;
margin-left: 13.5vw;
position: absolute;
top: -8px;
right: 6vw;
.ptz-control-jia,.ptz-control-jian{
width: 8.1vw;
height: 8.1vw;
line-height: 8.1vw;
text-align: center;
font-size: 8.1vw;
border-radius: 1.08vw;
border: 0.27vw solid #03a7ef;
width: 8vw;
height: 8vw;
border-radius: 4vw;
color: rgba(139, 147, 172, 1);
font-size: 6.3vw;
line-height: 6.5vw;
text-align: center;
border: 0.27vw solid rgba(211, 212, 219, 1);
&:active{
background-image: radial-gradient(circle at center,rgba(29,141,216,.8) 0,rgba(100,143,252,0) 80%);
}
}
.ptz-control-jia{
margin-right: 8vw;
margin-bottom: 4vw;
}
}
}
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!