提交 e4feec19 编写于 作者: DCloud-yyl's avatar DCloud-yyl

web端与app端截图差异优化:避免在条件编译中的scroll-view中设置style

上级 6e378556
<template> <template>
<!-- #ifdef APP --> <!-- #ifdef APP -->
<scroll-view style="flex:1;padding: 10px;"> <scroll-view style="flex:1;">
<!-- #endif --> <!-- #endif -->
<button @click="switchBtn">{{buttonValue}}</button>
<image class="transition-transform" id="transition-transform" @transitionend="onEnd" src="/static/uni.png"></image> <image class="transition-transform" id="transition-transform" @transitionend="onEnd" src="/static/uni.png"></image>
<text>对图片设置transform进行旋转,在旋转完成的transitionend事件后,继续旋转</text> <text class="adjust">对图片设置transform进行旋转,在旋转完成的transitionend事件后,继续旋转</text>
<button class="adjust" @click="switchBtn">{{buttonValue}}</button>
<!-- #ifdef APP --> <!-- #ifdef APP -->
</scroll-view> </scroll-view>
<!-- #endif --> <!-- #endif -->
...@@ -52,7 +52,10 @@ ...@@ -52,7 +52,10 @@
</script> </script>
<style> <style>
.transition-transform { .adjust {
margin: 10px;
}
.transition-transform {
width: 200px; width: 200px;
height: 200px; height: 200px;
margin: 25px auto; margin: 25px auto;
...@@ -61,5 +64,5 @@ ...@@ -61,5 +64,5 @@
transition-property: transform; transition-property: transform;
transition-timing-function: linear; transition-timing-function: linear;
transform: rotate(0deg); transform: rotate(0deg);
} }
</style> </style>
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册