52 lines
		
	
	
		
			1.2 KiB
		
	
	
	
		
			Plaintext
		
	
	
			
		
		
	
	
			52 lines
		
	
	
		
			1.2 KiB
		
	
	
	
		
			Plaintext
		
	
	
| <template>
 | |
|   <div class="back-btn-position-fx-style">
 | |
|     <slot />
 | |
|   </div>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| export default {
 | |
|   name: 'Affix',
 | |
|   props: {
 | |
|   },
 | |
|   data() {
 | |
|     return {
 | |
|     }
 | |
|   },
 | |
|   mounted() {
 | |
|     window.addEventListener('scroll', this.handleScroll)
 | |
|   },
 | |
|   methods: {
 | |
|     handleScroll(e) {
 | |
|       if (document.documentElement.scrollHeight - document.documentElement.scrollTop <= document.documentElement.clientHeight + 317) {
 | |
|         const fxDom = document.getElementsByClassName('back-btn-position-fx-style')
 | |
|         if (fxDom.length > 0) {
 | |
|           fxDom[0].classList.add('back-btn-position-ab-style')
 | |
|           fxDom[0].classList.remove('back-btn-position-fx-style')
 | |
|         }
 | |
|       } else {
 | |
|         const adDom = document.getElementsByClassName('back-btn-position-ab-style')
 | |
|         if (adDom.length > 0) {
 | |
|           adDom[0].classList.add('back-btn-position-fx-style')
 | |
|           adDom[0].classList.remove('back-btn-position-ab-style')
 | |
|         }
 | |
|       }
 | |
|     }
 | |
|   }
 | |
| }
 | |
| </script>
 | |
| 
 | |
| <style scoped>
 | |
| .back-btn-position-ab-style {
 | |
|   position: absolute;
 | |
|   top: 60px;
 | |
|   /* margin-left: 1074px; */
 | |
| }
 | |
| .back-btn-position-fx-style {
 | |
|   position: fixed;
 | |
|   top: 60px;
 | |
|   background: #fff;
 | |
|   /* margin-left: 1074px; */
 | |
| }
 | |
| </style>
 |