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

面板切换,也就是我们通常所有的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. Java使用PipedStream管道流通信

    多线程使用PipedStream 通讯 Java 提供了四个相关的管道流,我们可以使用其在多线程进行数据传递,其分别是 类名 作用 备注 PipedInputStream 字节管道输入流 字节流 Pi ...

  2. [20190416]完善shared latch测试脚本2.txt

    [20190416]完善shared latch测试脚本2.txt --//昨天测试shared latch,链接:http://blog.itpub.net/267265/viewspace-264 ...

  3. Windows Server 2016-Telnet 简介及安装

    Telnet是基于请求注释(RFC)854的因特网标准程序和协议,该RFC规定了一种在网络上发送和接收未加密的ASCII字符(明文)的方法.Telnet包含两个功能模块:Telnet客户端和Telne ...

  4. Word报告自动生成(例如 导出数据库结构)

    将很早之前写的一个小组件重新整理优化一下,做成一个通用的功能.适用于导出数据库的结构(表.字段等)到Word或将体检数据自动生成Word版的体检报告等.代码:Github 一.主要需要完成功能: 1. ...

  5. 《JavaScript设计模式与开发实践》笔记第八章 发布-订阅模式

    第八章 发布-订阅模式 发布-订阅模式描述 发布-订阅模式又叫观察者模式,它定义对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖于它的对象都将得到通知. 发布-订阅模式可以广泛应用于 ...

  6. .NET Core开源快速开发框架Colder发布 (NET Core2.1+AdminLTE版)

    引言 上星期发布的.NET452+AdminLTE版框架得到了大家的大力支持,目前GitHub已获近100星,鄙人十分高兴能够帮助大家.其中有不少关心.NET Core的支持情况,因为未来的.NET平 ...

  7. 【故障公告】推荐系统中转站撑爆服务器 TCP 连接引发的故障

    上周五下午,我们在博客中部署了推荐系统,在博文下方显示“最新IT新闻”的地方显示自动推荐的关联博文.我们用的推荐系统是第四范式的推荐服务,我们自己只是搭建了一个推荐系统中转站(基于 ASP.NET C ...

  8. nginx安装,启动亲测有效

    一:安装编译工具及库文件 yum -y install make zlib zlib-devel gcc-c++ libtool  openssl openssl-devel 二:安装PCRE,让 N ...

  9. Charles抓包工具使用

    Charles抓包工具使用和进行接口数据模拟 打开软件,选择Tools  >>  Map Local  >>  勾选enable  >>  add  >> ...

  10. Spring-webflow基础讲解

    什么是webflow: Spring Web Flow构建于Spring MVC之上,允许实现Web应用程序的“流程”.流程封装了一系列步骤,指导用户执行某些业务任务.它跨越多个HTTP请求,具有状态 ...