aardio 官方社区

 找回密码
 注册会员

QQ登录

只需一步,快速开始

搜索
查看: 13953|回复: 3

遨游css中监听事件用aardio如何能实现?

[复制链接]

6

主题

30

回帖

470

积分

二级会员

积分
470
发表于 2012-6-28 10:29:44 | 显示全部楼层 |阅读模式
侦听事件
界面需要针对用户的交互进行变化, 因此我们提供了事件侦听的支持以便实现此需求.
事件侦听通过 mx-listen 属性绑定到元素.
一个事件可以被绑定到多个元素上. 一个元素也可以绑定多个事件进行侦听.
事件在触发时会添加相应的自定义属性到侦听了事件的元素上.
例如一个元素:
<a mx-listen=”pageLoading unableBack” />
pageLoading 事件触发时, 会被加上 pageLoading 属性, 变成:
<a mx-listen=”pageLoading unableBack” pageLoading />
在 unableBack事件触发时, 会被加上 disabled 属性和 disabled 状态, 变成:
<a mx-listen=”pageLoading unableBack” disabled />
如果两个事件同时触发, 元素会变成:
<a mx-listen=”pageLoading unableBack” pageLoading disabled />
皮肤制作者可以根据此特性在 CSS 中定义元素的样式变化.
<style>
a:disabled{
        text-decoration: none;
}
a[pageLoading]{
        color: red;
}
a[pageLoading]:disabled{
        display: none;
}
</style>


下面是遨游css片段:

/*
        Frameless Window Mode support
*/
body[winFrameless]  {
        background: #7792AC url(images/win_bg.png) expand;
        background-position: 32 6 6 6;
        background-repeat: stretch-left stretch-right stretch-middle;
}
body[winFrameless][winMaximized] {
        background: #A6C1D9;
        background-image: none;
}


下面是遨游html片段:
<!-- Window Body -->
<body mx-listen="winFrameless winMaximized privateMode devVersion">



4

主题

852

回帖

4689

积分

荣誉会员

积分
4689
发表于 2012-6-28 10:45:23 | 显示全部楼层
这无非是在程序中增加了一些HTML属性而已,
CSS中的方括号是属性选择器,也就模拟出了“事件监听”的效果。

你可以看一下标准库的 web.layout.behavior.windowCommand
在窗口最大化是通过改变command属性,间接改变CSS,达到切换图标的效果。

至于遨游把这个大量的应用到皮肤系统中,这种设计僵硬混乱,不值得模仿。
你可以直接在HTMLayout中嵌入脚本。类似在传统页面中使用javascript,在范例中有示例代码。

16

主题

170

回帖

1404

积分

四级会员

积分
1404
发表于 2012-6-28 11:53:27 | 显示全部楼层
不争 发表于 2012-6-28 10:45
这无非是在程序中增加了一些HTML属性而已,
CSS中的方括号是属性选择器,也就模拟出了“事件监听”的效果。 ...

我想问一下支持的是javascript么?还是部分?
我只试了下alert不行就没再试别的了,也没相关帖子

6

主题

30

回帖

470

积分

二级会员

积分
470
 楼主| 发表于 2012-6-29 14:47:29 | 显示全部楼层
没办法,现在修改html, 有部分效果了。
您需要登录后才可以回帖 登录 | 注册会员

本版积分规则

手机版|未经许可严禁引用或转载本站文章|aardio.com|aardio 官方社区 ( 皖ICP备09012014号 )

GMT+8, 2024-9-9 13:22 , Processed in 0.059401 second(s), 22 queries .

Powered by Discuz! X3.5

Copyright © 2001-2024 Tencent Cloud.

快速回复 返回顶部 返回列表