微信小程序通过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是静态编译,运行时哪怕你修 ...
随机推荐
- 小工具:word表格文字转化成insert语句
群里的一个朋友有个需要,要让把word里的表格数据插入到数据库里面. 我的思路是,把格式化的数据转成insert语句,然后去执行就可以了. 要求的insert语句格式是:'insert into xx ...
- IOS学习基础
http://www.jikexueyuan.com/path/ios/ 界面优化 iOS界面绘图API.控件等知识. 1,绘制图片 2,画板实例 3, 1,UIView的setNeedsDispla ...
- python的回收机制
1,我们为什么要启用变量 因为我也不确定用户扔给我的数据是什么,有些同学在写程序的时候就已经将变量限定死了,我就说你这样不好,你只想测试一次吗,如果你想确保你的程序万无一失,通俗点说的话,就是“抗揍” ...
- kubernetes 命令记录
操作基本命令: 通过yaml文件创建: kubectl create -f xxx.yaml (不建议使用,无法更新,必须先delete) kubectl apply -f xxx.yaml (创 ...
- opencv-python 学习初探1
本人是windows10 ,Python3.6 32位.因为业务需要,需要实现一批图片处理,对比PIL和OpenCV后,选择后者.此文为菜鸟记录,大手子们求放过. 1.下载. 直接 pip insta ...
- kylin从入门到实战:实际案例
版权申明:转载请注明出处.文章来源:http://bigdataer.net/?p=308 排版乱?请移步原文获得更好的阅读体验 前面两篇文章已经介绍了kylin的相关概念以及cube的一些原理,这篇 ...
- DPDK的安装与绑定网卡
DPDK的安装有两种方法: 第一种是使用dpdk/tools/setup.sh选择命令字来安装:第二种是自己手动安装.为了更好地熟悉DPDK,我使用第二种方法. 0.设定环境变量 export RTE ...
- ROS编译时(catkin_make)找不到bullet,Could NOT find Bullet (missing: BULLET_DYNAMICS_LIBRARY
sudo apt-get install libbullet-dev
- Python day15装饰器基本理论,以及结合全局变量模拟session
装饰器(decorator):为其他函数添加附加功能 原则:1.不修改被修饰函数源代码 2.不修改被修饰函数的调用方式 装饰器=高阶函数+函数嵌套+闭包 import time def timmer( ...
- js焦点事件:onfocus、onblur、focus()、blur()、select()
焦点:使浏览器能够区分用户输入的对象,当一个元素有焦点的时候,那么他就可以接收用户的输入只有能够响应用户操作额元素才可以接收焦点事件,比如:a button input... onfocus:当元素获 ...