Browse Source

毛玻璃

master
congzc 1 year ago
parent
commit
e087d125c6
3 changed files with 27 additions and 1 deletions
  1. +5
    -1
      src/pages/closeStyle/goCreatePhoto.vue
  2. +4
    -0
      src/pages/index/index.vue
  3. +18
    -0
      src/style/my.scss

+ 5
- 1
src/pages/closeStyle/goCreatePhoto.vue View File

@@ -1,5 +1,9 @@
<template>
<view class="page">
<!-- 毛玻璃 -->
<view class="glass">
<image src="../../assets/img/homeImg.png" mode="scaleToFill" />
</view>
<view class="showImgBox imgContenBox"
><image :src="styleData.coverImg"
/></view>
@@ -31,7 +35,7 @@ import {
//#region 初始化
const styleId = ref(null);
const styleData = ref(null);
const styleData = ref({});
onLoad((options) => {
styleId.value = options.id;
getInfo();


+ 4
- 0
src/pages/index/index.vue View File

@@ -3,6 +3,10 @@
<!-- 背景图 -->
<!-- <image class="bgc" src="../../assets/img/avatar.png"></image> -->
<!-- 头像 -->
<!-- 毛玻璃 -->
<view class="glass">
<image src="../../assets/img/homeImg.png" mode="scaleToFill" />
</view>
<view class="avatarBox">
<image
class="avatar"


+ 18
- 0
src/style/my.scss View File

@@ -16,6 +16,24 @@
min-height: calc(100vh - 44px);
}
// 毛玻璃
.glass {
position: fixed;
width: 100vw;
height: 100vh;
z-index: -9;
image {
width: 100vw;
height: 100vh;
// position: fixed;
// background-size: 100% 100%;
// z-index: -1;
/* 通过滤镜增加毛玻璃效果 */
filter: blur(20rpx);
}
}
body {
-webkit-touch-callout: none;
/*系统默认菜单被禁用*/


Loading…
Cancel
Save