修改小程序下拉加载背景图和加载图标

h5

小程序

<scroll-view refresher-default-style='none' refresher-enabled @refresherpulling='enable' :refresher-triggered='refresh' refresher-background='url(http://pic.51yuansu.com/pic3/cover/00/75/13/58b84851d4afa_610.jpg) no-repeat 50% 150%'
								scroll-with-animation='true'  scroll-y="true" class="scroll-Y" ">
										<!-- 下拉加载小图标 -->
					<view class="gifLoading" :style="'display:'+disp"></view>
										
                    <view id="demo1" class="scroll-view-item uni-bg-red">A</view>
                    <view id="demo2" class="scroll-view-item uni-bg-green">B</view>
                    <view id="demo3" class="scroll-view-item uni-bg-blue">C</view>
</scroll-view>

		data() {
			return {
				refresh:false,
				disp:'none',			
			}
		},

methods:{
	enable:function(){
				this.refresh = true
				this.disp = 'block'
				setTimeout(()=>{
					this.refresh = false

			this.disp = 'none'
				},500)
				console.log(this.refresh)
	},
}

@-webkit-keyframes rotation{
		from {-webkit-transform: translateX(-50%) rotate(0deg);}
		to {-webkit-transform: translateX(-50%) rotate(360deg);}
		}
			.scroll-Y {
				background: linear-gradient(180deg,#E04B43 0%,#F6C859 100%);
				height: 300rpx;
			}
			/* #ifndef MP-WEIXIN*/
			/deep/ .uni-scroll-view-refresher{
				background: url(http://pic.51yuansu.com/pic3/cover/00/75/13/58b84851d4afa_610.jpg)  no-repeat 50% 80% !important
			}
			/* #endif */
			
			scroll-view{
			}
			/* 加载小图标 */
			.gifLoading{
				width: 30px;
				height:30px;
				margin-left: 50%;
				position: absolute; 
				
				top: 5px;
				/* #ifdef MP*/
				top: -40px;
				/* #endif */
				
				
				background:url(../../static/loading.png)  no-repeat center,linear-gradient(180deg,#E04B43 0%,#F6C859 100%);
				animation: rotation .8s linear infinite;
				border-radius: 50%;
			}