From 0485555dc1b3001920aa4ef0cff983fc435b25f5 Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期三, 21 八月 2024 15:12:46 +0800
Subject: [PATCH] 提交
---
pages/index/index.vue | 35 +++++++++++++++++++++++++++++++----
1 files changed, 31 insertions(+), 4 deletions(-)
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 5414e97..70208ac 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -1,6 +1,10 @@
<template>
<view class="box">
- <image :src="loginTop" class="topImg" mode="widthFix"></image>
+ <view class="topContainer">
+ <image :src="loginTop" class="topImg" mode="widthFix"></image>
+ <image :src="loginPic" class="topPic" mode="widthFix"></image>
+ </view>
+
<view class="main">
<view class="header">
<view class="titleFirst">
@@ -37,11 +41,13 @@
import store from '@/store/index.js'
import VUE_APP_BASE_URL from '../../common/constant.js'
const jpushModule = uni.requireNativePlugin('JG-JPush')
- import loginTop from '../../static/loginTop1.png'
+ import loginTop from '../../static/loginBg.png'
+ import loginPic from '../../static/loginPic.png'
export default {
data() {
return {
loginTop: loginTop,
+ loginPic: loginPic,
userFocused: false,
codeFocused: false,
form: {
@@ -210,10 +216,31 @@
flex-direction: column;
}
+.topContainer {
+ position: relative; /* 新增容器，并设置相对定位 */
+ width: 100%;
+}
+
.topImg{
width: 100%;
- height: 100%;
- filter: drop-shadow(0 3px 5px rgba(21,148,232,.1))
+ filter: drop-shadow(0 3px 8px rgba(21,148,232,.4));
+}
+.topPic{
+ width: 80%;
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ animation: float 3s ease-in-out infinite;
+}
+
+@keyframes float {
+ 0%, 100% {
+ transform: translate(-50%, -50%)
+ }
+ 50% {
+ transform: translate(-50%, calc(-50% + 8px))
+ }
}
.main{
--
Gitblit v1.9.2