view
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
検索
|
最終更新
|
ヘルプ
|
ログイン
]
開始行:
[[uni-app]]
&color(red){※前提条件:vue3 的uniapp开发};
#contents
* view组件用法 [#da174c6b]
当作div使用,view标签的常用属性:hover-class ,手指点击...
|属性名|类型|默认值|说明|h
|hover-class|String|none|指定按下去的样式类。当 hover-cla...
|hover-stop-propagation|Boolean|false|指定是否阻止本节点...
|hover-start-time|Number|50|按住后多久出现点击态,单位毫秒|
|hover-stay-time|Number|400|手指松开后点击态保留时间,单...
** 例程1 [#x75dfc95]
#codeprettify{{
<template>
<view class="max" hover-class="box2-active">
<view class="box" hover-class="box-active" hover-stop-p...
:hover-stay-time="2000">我是一个大盒子哦</view>
</view>
</template>
<style>
.max {
width: 200rpx;
height: 200rpx;
background-color: blue;
}
.box {
width: 100rpx;
height: 100rpx;
background-color: #F0AD4E;
}
.box-active {
background-color: #007AFF;
}
.box2-active {
background-color: pink;
}
</style>
}}
*** hover-stop-propagationy [#f9195fdf]
属性意思是阻止冒泡 点大盒子的时候小盒子不会变 反之亦然
*** hover-class="box-active" [#g1972b24]
指定按下去的样式类
也就是点击设置会变颜色
*** hover-start-time [#je5d1d22]
按住后多久出现点击态,单位毫秒
*** hover-stay-time [#kaabfc83]
手指松开后点击态保留时间,单位毫秒
** 例程2 [#ib62476b]
例子:animate.css和horver-class一起使用
#codeprettify{{
<!-- horver-class是手指点击该元素所产生的效果 bounceIn才...
<view class="box animated" hover-class="bounceIn"></view>
}}
#hr();
Comment:
#comment_kcaptcha
終了行:
[[uni-app]]
&color(red){※前提条件:vue3 的uniapp开发};
#contents
* view组件用法 [#da174c6b]
当作div使用,view标签的常用属性:hover-class ,手指点击...
|属性名|类型|默认值|说明|h
|hover-class|String|none|指定按下去的样式类。当 hover-cla...
|hover-stop-propagation|Boolean|false|指定是否阻止本节点...
|hover-start-time|Number|50|按住后多久出现点击态,单位毫秒|
|hover-stay-time|Number|400|手指松开后点击态保留时间,单...
** 例程1 [#x75dfc95]
#codeprettify{{
<template>
<view class="max" hover-class="box2-active">
<view class="box" hover-class="box-active" hover-stop-p...
:hover-stay-time="2000">我是一个大盒子哦</view>
</view>
</template>
<style>
.max {
width: 200rpx;
height: 200rpx;
background-color: blue;
}
.box {
width: 100rpx;
height: 100rpx;
background-color: #F0AD4E;
}
.box-active {
background-color: #007AFF;
}
.box2-active {
background-color: pink;
}
</style>
}}
*** hover-stop-propagationy [#f9195fdf]
属性意思是阻止冒泡 点大盒子的时候小盒子不会变 反之亦然
*** hover-class="box-active" [#g1972b24]
指定按下去的样式类
也就是点击设置会变颜色
*** hover-start-time [#je5d1d22]
按住后多久出现点击态,单位毫秒
*** hover-stay-time [#kaabfc83]
手指松开后点击态保留时间,单位毫秒
** 例程2 [#ib62476b]
例子:animate.css和horver-class一起使用
#codeprettify{{
<!-- horver-class是手指点击该元素所产生的效果 bounceIn才...
<view class="box animated" hover-class="bounceIn"></view>
}}
#hr();
Comment:
#comment_kcaptcha
ページ名: