无论是谁,在刚开始接触一门不太熟悉的东西时都有一种恐惧感,但是慢慢多练习几遍,再多琢磨琢磨,形成自己的见解和认识,就掌握的差不多了。我说的是题外话,现在转入正题。

面板切换,也就是我们通常所有的tab切换。

几个简单的步骤就可完成: 先看图,我们预想的是默认情况下:显示快速登录按钮的选中状态,下面内容显示相应的内容:‘我是内容一’,点击账户密码登录,选中账户密码登录状态,显示对应的内容:‘我是内容二’

步骤1:

页面上拖入一个动态面板,双击动态面板,点击+,增加一个状态 state2。好了,现在面板上有两个状态了.

步骤2:

动态面板上面拖入两个矩形,设置两个矩形的选中状态的样式。

步骤3:

添加点击事件

步骤4:

设置两个矩形一个组,这样的情况下,只能选中一个按钮。

经过这几个步骤,已经可以实现一个tab页面。自己试试看吧。

Axure之动态面板:登录面板切换的更多相关文章

  1. layui js动态添加的面板不能折叠

    layui 动态添加dom后一般调用 layer.form.render()更新dom就可以了,但是我动态添加一个面板后form.render()就没有效果,要用layui.element.rende ...

  2. Axure 页面内多组内容切换的实现 + 利用一个内联框架实现百度地图访问

    Axure  页面内多组内容切换的实现,场景:点击某个元件的时候,会显示响应的页面 操作:将显示的页面设置为动态面板,如图所示应该设置动态面板的状态为三个状态,分别为点击qq账号.手机账号.邮箱账号时 ...

  3. ecshop 完美解决动态ip登录超时和购物车清空问题

    ecshop 完美解决动态ip登录超时和购物车清空问题 ECSHOP模板/ecshop开发中心(www.68ecshop.com) / 2014-05-06 前一段时间,ECSHOP开发中心的一个客户 ...

  4. 用JS动态创建登录表单,报了个小错误

    后来发现原来是: dvObj.style.border='#Red 1px sold'; 其中的Red多谢了一个‘#’, 但是奇怪的是在chrome和firefox都备有报错,但是在ie中报错了. 各 ...

  5. 基于CSS3动态背景登录框代码

    基于CSS3动态背景登录框代码.这是一款基于jQuery+CSS3实现的带有动画效果的动态背景登陆框特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class ...

  6. vue2.0使用动态组件实现tab切换效果(vue-cli)

    <template> <div> <div>#动态组件实现tab切换效果#</div><br><br><br> &l ...

  7. 很实用的HTML5+CSS3注册登录窗体切换效果

    1. [代码]3个很实用的HTML5+CSS3注册登录窗体切换效果 <!DOCTYPE html><!--[if lt IE 7 ]> <html lang=" ...

  8. qq登录面板

  9. Axure RP动态面板操作

    参考资料: 动态面板实现banner的轮播效果

随机推荐

  1. js 滚轮控制图片缩放大小和拖动

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 基于GitLab的Code Review教程

    一.前言 1.本文主要内容 GitLab Code Review机制说明 Git Workflow 与 Git Code Review Workflow GitLab Code Review 配置说明 ...

  3. 关闭windows系统的危险端口,命令行

    防火墙启用,增加禁用端口提供给外部访问 @echo off color E2 title 关闭常见的危险端口 echo 正在开启Windows防火墙 echo. netsh advfirewall s ...

  4. C# 匿名对象(匿名类型)、var、动态类型 dynamic——实用之:过滤类属性、字段实用dynamic

    例子 返回一个LIst<oject>类型 而oject含有 30个字段 而我只需要两个字段.这里实用dynamic 和 linq. 上代码: 注意select new {} 为匿名类型,这 ...

  5. 为什么CynosDB叫真正的云原生数据库?

    本文由腾讯云数据库发表 注:本文摘自2018年11月22日腾讯云数据库CynosDB新品发布会的演讲实录.随着互联网信息的发展,大家也对云这个词汇也不是特别陌生了,作为全球首选的云服务厂商之一的腾讯云 ...

  6. 【Teradata SQL】行转列函数TDStats.udfConcat

    TDstats.udfConcat为Teradata自带UDF,定义如下: show function tdstats.udfconcat; REPLACE FUNCTION tdstats.UDFC ...

  7. python 操作Excel文件

    1   安装xlrd.xlwt.xlutils cmd下输入: pip install xlrd        #读取excel pip install xlwt        #写入excel pi ...

  8. 爬虫基础(五)-----scrapy框架简介

    ---------------------------------------------------摆脱穷人思维 <五> :拓展自己的视野,适当做一些眼前''无用''的事情,防止进入只关 ...

  9. 三十九、vue中element最原始的分页(未封装的)

    html<el-table ref="scoreUserTable" :data="scorePageUser.slice((currentPage1-1)*pag ...

  10. Python发送邮件脚本

    import smtplib from email.mime.text import MIMEText mailserver = "smtp.163.com" username_s ...