resultPage.vue 873B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. <template>
  2. <div>
  3. <img class="bgi" src="../../public/images/result/resultbgi.jpg" width="100%" />
  4. <img @click="onShare" class="share" src="../../public/images/result/sharebtn.png" width="45%" />
  5. <img
  6. @click="close"
  7. v-show="isShare"
  8. class="sharebgi"
  9. src="../../public/images/result/sharebgi.png"
  10. width="100%"
  11. />
  12. </div>
  13. </template>
  14. <script>
  15. export default {
  16. data() {
  17. return {
  18. isShare: false
  19. }
  20. },
  21. methods: {
  22. onShare() {
  23. this.isShare = true
  24. },
  25. close() {
  26. this.isShare = false
  27. }
  28. }
  29. }
  30. </script>
  31. <style scoped>
  32. .bgi {
  33. z-index: 1;
  34. position: absolute;
  35. }
  36. .sharebgi {
  37. z-index: 100;
  38. position: absolute;
  39. height: 193vw;
  40. }
  41. .share {
  42. z-index: 3;
  43. position: absolute;
  44. top: 154vw;
  45. /* align-items: center; */
  46. /* width: 47%; */
  47. /* margin: 0 auto; */
  48. left: 27.5vw;
  49. }
  50. </style>