微信小程序通过js动态修改css样式的方法(交流QQ群:604788754)
WXML
<view class="page" style="background-color:{{pageBackgroundColor}}" >
<button bindtap="changeColor" hover-class="none">点击修改背景颜色</button>
</view>
WXSS:
.page {
display: block;
min-height: %;
width: %;
position: absolute;
left: ;
top: ;
z-index: ;
}
JS:
Page({
data: {
// 自定义page对象CSS样式对象
pageBackgroundColor: '#5cb85c'
},
onLoad: function () { },
// 改变背景颜色
changeColor: function () {
var bgColor = this.data.pageBackgroundColor == 'red' ? '#5cb85c' : 'red';
// 设置背景颜色数据
this.setData({
pageBackgroundColor: bgColor
});
}
})
微信小程序通过js动态修改css样式的方法(交流QQ群:604788754)的更多相关文章
- 微信小程序通过JS动态修改页面标题setNavigationBarTitle
wx.setNavigationBarTitle({title: '当前页面'})
- 小程序中的bindtap和catchtap的区别(交流QQ群:604788754)
bindtap绑定的节点,如果他的父节点也有绑定事件,点击之后就会出现冒泡. catchtap绑定的节点,如果他的父节点也有绑定事件,点击之后不会出现冒泡.
- 微信小程序:JS 交互逻辑
微信小程序:JS 交互逻辑 一.JS 交互逻辑 一个服务仅仅只有界面展示是不够的,还需要和用户做交互:响应用户的点击.获取用户的位置等等.在小程序里边,我们就通过编写 JS 脚本文件来处理用户的操作. ...
- 记录一次用宝塔部署微信小程序Node.js后端接口代码的详细过程
一直忙着写毕设,上一次写博客还是元旦,大半年过去了.... 后面会不断分享各种新项目的源码与技术.欢迎关注一起学习哈! 记录一次部署微信小程序Node.js后端接口代码的详细过程,使用宝塔来部署. 我 ...
- 原创:新手布局福音!微信小程序使用flex的一些基础样式属性
来源:新手布局福音!微信小程序使用flex的一些基础样式属性 作者:Nazi Flex布局相对于以前我们经常所用到的布局方式要好的很多,在做微信小程序的时候要既能符合微信小程序的文档开发要求,又能 ...
- 微信小程序:封装全局的promise异步调用方法
微信小程序:封装全局的promise异步调用方法 一:封装 function POST(url, params) { let promise = new Promise(function (resol ...
- ASP.NET中直接用C# 动态修改CSS样式
ASP.NET中直接用C# 动态修改CSS样式 wonsoft (wonsoft@163.com) 使用JavaScript控制CSS样式有点麻烦,还是觉得直接使用C#操作更方便快捷,本文通过两个B ...
- 微信小程序开发:学习笔记[4]——样式布局
微信小程序开发:学习笔记[4]——样式布局 Flex布局 新的布局方式 在小程序开发中,我们需要考虑各种尺寸终端设备上的适配.在传统网页开发,我们用的是盒模型,通过display:inline | b ...
- 微信小程序换皮肤,动态切换菜单栏和导航栏的样式,动态修改TabBar和NavigationBar
在做微信小程序换皮肤的时候,需要动态修改菜单栏(TabBar)和导航栏(NavigationBar) 但是在小程序中它们的样式是写在app.json里面,而且app.json是静态编译,运行时哪怕你修 ...
随机推荐
- div转svg svg转canvas svg生成图片及图片下载 分享
链接来自:http://blog.csdn.net/u010081689/article/details/50728854
- Go第二篇之基本语法总结
Go语言标识符 标识符以字母或下划线开头,大小写敏感 _是特殊标识符,用来忽略结果 Go语言变量的声明 变量(Variable)的功能是存储用户的数据.不同的逻辑有不同的对象类型,也就有不同的变量类型 ...
- Mac安装和卸载HomeBrew
安装方法: /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/ ...
- Luogu USACO Training 刷水记录
开个坑记录一下刷USACO的Training的记录 可能会随时弃坑 只有代码和做法简述 可能没有做法简述 [USACO1.1]你的飞碟在这儿Your Ride Is He… 模拟,细节已忘 #incl ...
- C# Byte[] 数组操作
byte[] Strbyte = Encoding.GetEncoding("big5").GetBytes(str); if (Strbyte.Length ...
- NOI 08 石头剪刀布
石头剪刀布(NOI 08) 总时间限制: 1000ms 内存限制: 65536kB 描述 石头剪刀布是常见的猜拳游戏.石头胜剪刀,剪刀胜布,布胜石头.如果两个人出拳一样,则不分胜负. 一天,小A和小B ...
- Linux——用户管理简单学习笔记(二)
其实如果我们了解了Linux中用户管理的配置文件之后,完全可以手工管理用户: 添加用户: useradd 设置选项 用户名 -D 查看缺省参数 u:UID g:缺省所属用户组GID G:指定用户所属多 ...
- TDD、BDD、DDD
TDDTest-Driven DevelopmentTest-Driven Development (TDD) is a software development technique where au ...
- SQL Insert Case When Update
CREATE TABLE LoadTestTable ( ID INT IDENTITY(1,1), FIRSTNAME VARCHAR(50), LASTNAME VARCHAR(50), GEND ...
- Asp.net Ajax(ashx)
主要实现 ajax分页功能 效果图 后台方法代码展示 /// <summary> /// WebAjax处理类 /// </summary> public class WebA ...